Border

scardaddy

Hello,

Old user new to post. I just updated my mirror from a while back and the border outlining is now far too big. Maybe I missed something, but the OS still has the correct resolution, but the difference is about 5-%10% around the whole screen. I am not talking about over/underscan I am speaking about the Magic Mirror software specifically. I searched around the form looking for a way to remove the border but have not been successful. So I figured it was an update and there might be no way to remove it. I appreciate any help in advance.

Mykle1

@scardaddy

Perhaps this in the custom.css file:

body {
  margin: 20px; 
  height: calc(100% - 40px);
  width: calc(100% - 40px);
}

It doesn’t remove the border. It gives you a 20px border. You can play with the values to your liking

scardaddy

@Mykle1 Ah thank you, I appreciate the help and the suggestion.

scardaddy

This post is deleted!

Peter

I have a strange problem and cannot find the solution.
In the first picture you see the right borders are good.
In the module MovieListings there is one movie with a longer text and when it occurs on the MM, the border of NOAA also changes (second picture).
Can any body help me wit this?
Peter

doubleT

Looks like it’s divided in two parts with 50% 50% each but a set max-height for the image. So when the container is widened by the headline, the two areas get wider aswell.
You can check the width in the developer tools and set it as max-width or width in custom.css

Peter

I have no idea how to change the settings.
All the modules on the right side are in the right_top region.
All modules are positioned well untill the movie with the long title apears.
If somebody has a solution; please explain me how to fix it.
Peter

ninjabreadman

@Peter Suggest you try this to limit the width of the MMM-MovieListings module:

.module.MMM-MovieListings {
  max-width: 400px; /* adjust as needed */
}

You said it’s a long title, but isn’t the title “Every Day”? Is it the movie tagline stretching the
module? I think you could target it with something like this:

.module.MMM-MovieListings div div:nth-child(2) {
  white-space: normal; /* why is it not wrapping? strange */
  word-wrap: normal; /* break the text to a new line */
}

There are no classes, so I’m just eyeballing something based on the markup generated here.

Peter

Thank you for your help!
Unfortunately it did not work.
Peter

ninjabreadman

@Peter can you share your MMM-MovieListings config? I’ll try to replicate the issue.

If you start MM with npm start dev, you can use the DOM inspector to see Inspect the MMM-MovieListings module (or just press Ctrl+Alt+I). What classes does the module have? Can you see your CSS being applied?