Layout problem

[broberg]

@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.

[fiskaren]

@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!

[strawberry 3.141]

@fiskaren custom.css

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

[broberg]

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%;
}

[fiskaren]

@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

[FlatPepsi]

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.