Border

Mykle1

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?

Peter

@ninjabreadman I feel really stupid, but starting MM with npm start dev fails.
And I have no idea what the DOM inspector is.
Very sorry for that.
This is the MMM-MovieListings config:

	{
			module: "MMM-MovieListings",
			position: "top_right",
  				// Default module config.
				defaults: {
    				apiKey: '04b3f48b71a2ac28797f94d0201a68f6',
				region: 'NL',
    				language: 'en-EN',
    				interface: 'poster', //'list', 'poster', 'detailed'
    				includeMoviePlot: false,
    				maxPlotLength: 198,
    				header: 'Nu in de bioscoop',
    				moviesPerPage: 0,
    				refreshInterval: 1000 * 60 * 60 * 24, //Once a day
    				baseUrl: 'https://api.themoviedb.org/3/movie/now_playing',
    				animationSpeed: 2.5 * 1000,
    				pageChangeInterval: 30 * 1000
		}		
		},

Peter