MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    Centering Photos on MMM-ImagesPhotos

    Scheduled Pinned Locked Moved Unsolved Troubleshooting
    11 Posts 3 Posters 3.5k Views 3 Watching
    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.
    • K Offline
      kit444 @plainbroke
      last edited by

      @plainbroke Unfortunately if I use the middle_center position, the photos will block out the other modules on the page. I need to use the fullscreen_below region. I tried to add the Horizontal-align to my css, but it didn’t recognize that parameter.

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

        @plainbroke weird. the code reads the screen height and width and adjusts the position and size to keep the same aspect ratio.

        also, the background is already black

        only on my version. the original does it differently

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        1 Reply Last reply Reply Quote 0
        • S Do not disturb
          sdetweil @kit444
          last edited by

          @kit444 you could add a css z-index:-1

          but that is what background does.

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          K 1 Reply Last reply Reply Quote 0
          • K Offline
            kit444 @sdetweil
            last edited by

            @sdetweil I could use that code to position the middle_center region behind the other regions?

            S 1 Reply Last reply Reply Quote 0
            • S Do not disturb
              sdetweil @kit444
              last edited by sdetweil

              @kit444 z-index:-?? just pushes it farther away, other modules would then be on top z-index:0;

              fullscreen-above is z-index:1;

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              K 1 Reply Last reply Reply Quote 0
              • K Offline
                kit444 @sdetweil
                last edited by

                @sdetweil I’m still not having any luck. I tried adding z-index: -1 to the region.middle_center in the custom css. It still placed the photos over some of the modules. I tried adding a z-index: 0 or 1 to another region to see if I could re-layer the regions. No difference. I added z-index: -1 to the middle_center region in the main. css. It centered the photos under all the other regions, but left a black bar in the middle of each. Lastly I tried to add an align-items and align-content to the main css under the fullscreen region. Neither worked.

                S 1 Reply Last reply Reply Quote 0
                • S Do not disturb
                  sdetweil @kit444
                  last edited by sdetweil

                  @kit444 rather than try and try and try

                  see
                  https://forum.magicmirror.builders/topic/14862/help-with-a-couple-css-issues?_=1644962684132

                  one thing to do to learn the regions is to set each to a different background color.

                  the regions overlap…

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  1 Reply Last reply Reply Quote 0
                  • 1
                  • 2
                  • 2 / 2
                  • First post
                    Last post
                  Enjoying MagicMirror? Please consider a donation!
                  MagicMirror created by Michael Teeuw.
                  Forum managed by Sam, technical setup by Karsten.
                  This forum is using NodeBB as its core | Contributors
                  Contact | Privacy Policy