Read the statement by Michael Teeuw here.
Modify the Gap/Margins
-
I have removed overscan so it fits to the entire screen but I still have margins. Anyone know where I can go to removed/change these?
Pictured below. The top and left margins are the worst.
-
Hi @ALombardi ,
edit your custom.css and add these Lines. The Body Part should look like this:
body {
margin: 30px;
position: absolute;
height: calc(100% - 50px);
width: calc(100% - 50px);
} -
Thanks, @ostfilinchen! Someone reached out over chat and took care of it for me. I appreciate your assistance. Hopefully someone else can benefit from this thread though!
-
For those of us who use this in a real Magic Mirror there’s no need to have any margins (top, left, right, bottom) and it is great to use all pixels of the display. If you’re with me… use the following in ~/MagicMirror/css/custom.css:
body { margin: 0px; position: absolute; height: 100%; width: 100%; }
-
Replying to an old post…I know. But it shows up in search engine results.
One way to easily/cleanly make this adjustment is included in the sample custom.css. Below is an example with the relevant parts only, and adjustments to my preferences (were all
60px
values before).:root { --gap-body-top: 10px; --gap-body-right: 20px; --gap-body-bottom: 10px; --gap-body-left: 20px; }