MagicMirror Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • Donate
    • Discord
    MagicMirror² v2.24.0 is available! For more information about this release, check out this topic.

    UNSOLVED MMM-Imageslideshow - centering upright images

    Troubleshooting
    3
    7
    255
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • B
      Bobrae last edited by

      When displaying upright (portrait) pictures, using position: ‘fullscreen_below’, in the module configuaration, pictures always appear on the left hand side of the screen.
      Is there any way of making them appear in the centre, but still below the other modules?

      S 1 Reply Last reply Reply Quote 0
      • S
        sdetweil @Bobrae last edited by

        @Bobrae i had to do that on code, for my updated MMM-ImagesPhotos,

        https://github.com/sdetweil/MMM-ImagesPhotos

        don’t know how to detect image size to correct via css directly

        Sam

        Create a working config
        How to add modules

        P 1 Reply Last reply Reply Quote 0
        • P
          plainbroke @sdetweil last edited by plainbroke

          @Bobrae
          I use this in my custom.css file to move MMM-ImagesPhotos down below the Date and Time on my mirror.

          .MMM-ImagesPhotos {
                  Margin-top: 35px;
          }```
           You can adjust that to what ever instead of 35 px I use. 
           I have one module (MMM-Bored) that I use 420px as my top margin. 
           It just takes some time to find the perfect placement to center.
          S 1 Reply Last reply Reply Quote 0
          • S
            sdetweil @plainbroke last edited by

            @plainbroke he wants to move vertical pics to the center of the screen. only vertical pics

            Sam

            Create a working config
            How to add modules

            P 1 Reply Last reply Reply Quote 0
            • P
              plainbroke @sdetweil last edited by

              @sdetweil
              Oh well, He is out of luck then, right?

              S 1 Reply Last reply Reply Quote 0
              • S
                sdetweil @plainbroke last edited by sdetweil

                @plainbroke I don’t know how to do that w css.
                I do it in code for my version of

                MMM-ImagesPhotos

                but maybe

                Screenshot_20220811-181449_Chrome.jpg

                it says without css, then gives a css only answer

                so in custom.css

                .MMM-ImagesSlideshow  img {
                     display: block;
                     margin-left: auto;
                     matgin-right: auto;
                }
                

                this will center both kinds of images, portrait and landscape

                Sam

                Create a working config
                How to add modules

                P 1 Reply Last reply Reply Quote 0
                • P
                  plainbroke @sdetweil last edited by

                  @sdetweil
                  I run pretty much all modules middle_center so they all center up pretty well for me. up and down is my only adjustments usually. I have had to adjust the left or right margin a few times but most everything centers on its own pretty well using the middle_center postion when setting them up… So I am absolutely of no help to him…

                  1 Reply Last reply Reply Quote 0
                  • 1 / 1
                  • First post
                    Last post
                  Enjoying MagicMirror? Please consider a donation!
                  MagicMirror created by Michael Teeuw.
                  Forum managed by Paul-Vincent Roll and Rodrigo Ramírez Norambuena.
                  This forum is using NodeBB as its core | Contributors
                  Contact | Privacy Policy