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.

    Resize middle center region

    Scheduled Pinned Locked Moved Development
    3 Posts 3 Posters 1.6k Views 5 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.
    • D Offline
      dcarls91
      last edited by

      Hello I am currently trying to place MMM-SmartWebDisplay in the middle center of my mirror. I adjusted the width via the config.js file. However, I am unable to make the module any taller than the formatted size of the middle center bar. I am wondering if this is something I have to do from the custom .js file as well as do I resize the region or actual module. Also, I am still learning the css so any help would be greatly appreciated. Thanks

      S 1 Reply Last reply Reply Quote 0
      • J Offline
        JJTechman68
        last edited by

        Did you ever find a solution? I have the same problem.

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

          @dcarls91 i think you could override the regions sizings in custom.css

          this is whats in main.css for the center

          .region.third,
          .region.middle.center {
            width: 100%;
            text-align: center;
            transform: translateY(-50%);
          }
          
          .region.upper.third {
            top: 33%;
          }
          
          .region.middle.center {
            top: 50%;
          }
          
          .region.lower.third {
            top: 66%;
          }
          

          and index.html (spaces after < because the viewer here does some funny stuff)

                  < div class="region upper third">< div class="container">< /div>< /div>
          	< div class="region middle center">< div class="container">< /div>< /div>
          	< div class="region lower third">< div class="container"><br/>< /div>< /div>
          

          so, if u make upper a little smaller and middle a little bigger… it might work out

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          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 Sam, technical setup by Karsten.
          This forum is using NodeBB as its core | Contributors
          Contact | Privacy Policy