• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
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.

Layout problem

Scheduled Pinned Locked Moved Troubleshooting
9 Posts 4 Posters 5.7k 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.
  • B Offline
    broberg Project Sponsor @fiskaren
    last edited by Mar 8, 2017, 6:04 PM

    @fiskaren no, if they are in the same region they will always stock on top of each other.

    use top_left for clock and top_right for weather and then place the other modules in the upper/lower third regions and bottom regions.

    F 1 Reply Last reply Mar 8, 2017, 9:51 PM Reply Quote 0
    • F Offline
      fiskaren @broberg
      last edited by Mar 8, 2017, 9:51 PM

      @broberg Well I am not really happy with the results right now. I have changed the size pretty much, but they still merge into eachother. And I realize I have to change the size even more if I dont want them to do that. And since that changes the font on every module it will look crazy and also unreadable.

      Here is a picture of how it looks right now:
      http://imgur.com/a/t8JDj

      Is it possible to force the modules some pixels out? Because if so I could put them closer to the edges and that would probably solve the problem.

      The last solution could be to remove wind-speed. But it’s windy where I live and I would very much like to know the wind speed!

      S 1 Reply Last reply Mar 8, 2017, 9:55 PM Reply Quote 0
      • S Offline
        strawberry 3.141 Project Sponsor Module Developer @fiskaren
        last edited by Mar 8, 2017, 9:55 PM

        @fiskaren custom.css

        body {
          margin: 0px;
          height: 100%;
          width: 100%;
        }
        

        Please create a github issue if you need help, so I can keep track

        F 1 Reply Last reply Mar 9, 2017, 3:57 PM Reply Quote 0
        • B Offline
          broberg Project Sponsor
          last edited by Mar 9, 2017, 7:29 AM

          Do what strawberry wrote, it will give you more space on the screen.

          also

          This should change the size of the fonts in the top two modules only

          
          .currentweather {
          font-size: 50%;
          }
          
          .clock {
          font-size: 50%;
          }
          
          
          1 Reply Last reply Reply Quote 0
          • F Offline
            fiskaren @strawberry 3.141
            last edited by Mar 9, 2017, 3:57 PM

            @strawberry-3.141 said in Layout problem:

            @fiskaren custom.css

            body {
              margin: 0px;
              height: 100%;
              width: 100%;
            }
            

            @broberg said in Layout problem:

            Do what strawberry wrote, it will give you more space on the screen.

            also

            This should change the size of the fonts in the top two modules only

            
            .currentweather {
            font-size: 50%;
            }
            
            .clock {
            font-size: 50%;
            }
            
            

            Awesome. Thank you both. It looks perfect now! :D

            1 Reply Last reply Reply Quote 0
            • F Offline
              FlatPepsi
              last edited by FlatPepsi Mar 9, 2017, 6:21 PM Mar 9, 2017, 6:19 PM

              You might find this useful, I thought it was awesome when I saw it:

              https://forum.magicmirror.builders/topic/286/regions

              top_bar and bottom_bar are light gray
              top_left and bottom_left are red
              top_center and bottom_center are blue
              top_right and bottom_right are green
              upper_third is yellow
              middle_center is cyan
              lower_third is magenta

              All these regions will resize as needed.
              alt text

              1 Reply Last reply Reply Quote 0
              • 1 / 1
              1 / 1
              • First post
                8/9
                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