<![CDATA[layer definition: here MMM-Globe overlaps left panel]]>I tested my Magic Mirror today with a rotated display and found, that the picture of my globe in MMM-Globe overlaps the left panel side. That is also, if I move the MMM-Globe in the config.sys to the top. The right panel side is nicely in the background and above the globe.
Is there a way to show change the layer visibility?

0_1484175611136_2017-01-11-235604_1080x1920_scrot.png

]]>https://forum.magicmirror.builders/topic/1393/layer-definition-here-mmm-globe-overlaps-left-panelRSS for NodeSun, 10 May 2026 07:44:41 GMTWed, 11 Jan 2017 23:00:34 GMT60<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Sun, 21 Nov 2021 09:24:41 GMT]]>Hi everyone,
if anyone has still trouble with it. I installed the MMM-Globe module and had the same issue. I declared all modules to foreground and just the globe one layer behind all. Keep an eye onto the z-index config. Worked fine for me.

I use the globe module in config.js at the middle_center:

module: 'MMM-Globe',
position: 'middle_center',

What I’ve declared in custom.css:

.module {
z-index: 1;
width: 300px;
transform: scale(1.3);
padding-bottom: 15%;
}

.MMM-Globe {
z-index: 0;
width: 100%;
height: 100%;
position: absolute;
margin: auto;
padding-top: 120%;
opacity: 0.7;
}

Greets,
Dee.

]]>https://forum.magicmirror.builders/post/96616https://forum.magicmirror.builders/post/96616Sun, 21 Nov 2021 09:24:41 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Sat, 16 Sep 2017 13:53:20 GMT]]>@Niggich nope :( does not work either

]]>https://forum.magicmirror.builders/post/28145https://forum.magicmirror.builders/post/28145Sat, 16 Sep 2017 13:53:20 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Sat, 16 Sep 2017 12:37:15 GMT]]>@schlachtkreuzer6 hmm… try to re-install the modul!

]]>https://forum.magicmirror.builders/post/28144https://forum.magicmirror.builders/post/28144Sat, 16 Sep 2017 12:37:15 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 15 Sep 2017 22:04:38 GMT]]>@Niggich nope does not work for me… strange! i changed the location of the globe (lower third), without any success.

]]>https://forum.magicmirror.builders/post/28133https://forum.magicmirror.builders/post/28133Fri, 15 Sep 2017 22:04:38 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 15 Sep 2017 13:41:22 GMT]]>@schlachtkreuzer6 This is my Entry at the custom.css.

.region.lower.third {
	z-index: 0;
	position: absolute;
}

Maybe you have to change the position in the custom.css like .region.top.center.

]]>https://forum.magicmirror.builders/post/28122https://forum.magicmirror.builders/post/28122Fri, 15 Sep 2017 13:41:22 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 15 Sep 2017 13:23:22 GMT]]>@Niggich yes

]]>https://forum.magicmirror.builders/post/28121https://forum.magicmirror.builders/post/28121Fri, 15 Sep 2017 13:23:22 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 15 Sep 2017 13:17:13 GMT]]>@schlachtkreuzer6 Without this in your custom.css the Globe is working?

]]>https://forum.magicmirror.builders/post/28120https://forum.magicmirror.builders/post/28120Fri, 15 Sep 2017 13:17:13 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 15 Sep 2017 12:57:27 GMT]]>@strawberry-3.141 @Niggich
Hi guys! I crashed my sd card and now this :
.region.top.center { z-index: -2 position: absolute; }
work anymore!?! If I c+p this in my custom.css the globe disappears!?

]]>https://forum.magicmirror.builders/post/28119https://forum.magicmirror.builders/post/28119Fri, 15 Sep 2017 12:57:27 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Sat, 04 Feb 2017 17:12:16 GMT]]>@strawberry-3.141
yes!! Thats it! I just have to change the region to lower.third…

Thanks a lot!

]]>https://forum.magicmirror.builders/post/13601https://forum.magicmirror.builders/post/13601Sat, 04 Feb 2017 17:12:16 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Sat, 04 Feb 2017 17:00:00 GMT]]>@Niggich @schlachtkreuzer6

for me the following is working

.region.top.center {
z-index: -2
position: absolute;
}
]]>https://forum.magicmirror.builders/post/13596https://forum.magicmirror.builders/post/13596Sat, 04 Feb 2017 17:00:00 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Sat, 04 Feb 2017 16:48:12 GMT]]>@strawberry-3.141

nope… it’s not working for me…

]]>https://forum.magicmirror.builders/post/13592https://forum.magicmirror.builders/post/13592Sat, 04 Feb 2017 16:48:12 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Sat, 04 Feb 2017 16:15:28 GMT]]>@strawberry-3.141 thats my custom.css:

/*****************************************************
 * Magic Mirror                                      *
 * Custom CSS                                        *
 *                                                   *
 * By Michael Teeuw http://michaelteeuw.nl           *
 * MIT Licensed.                                     *
 *                                                   *
 * Add any custom CSS below.                         *
 * Changes to this files will be ignored by GIT. *
 *****************************************************/

body {
  margin: 20px;
  position: absolute;
  height: calc(100% - 40px);
  width: calc(100% - 40px);
  background: #000;
  color: #aaa;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
  font-size: 2em;
  line-height: 1.5em;
  -webkit-font-smoothing: antialiased;
}

.brightb {
color: #55acee;
}
.currentweather .wi-sunrise {
color: #ffd700;
}
.currentweather .wi-sunset {
color: #ffa500;
}
.currentweather .wi-day-sunny {
color: #ffff00;
}
.currentweather .wi-night-showers {
color: #55acee;
}
.currentweather .wi-degrees {
color: #415;
}
.currentweather .wi-rain {
color: #55acee;
}
.currentweather .wi-showers {
color: #55acee;
}
.currentweather .wi-night-showers {
color: #55acee;
}
.currentweather .wi-night-alt-cloudy-windy {
color: #aaa;
}
.currentweather .wi-night-cloudy {
color: #aaa;
}
.currentweather .wi-cloudy {
color: #aaa;
}
.currentweather .wi-day-cloudy {
color: #aaa;
}
.currentweather .wi-cloudy {
color: #aaa;
}
.currentweather .wi-cloudy-windy {
color: #aaa;
}
.currentweather .wi-showers {
color: #55acee;
}
.currentweather .wi-thunderstorm {
color: #ff00ff;
}
.currentweather .wi-snow {
color: #fff;
}
.currentweather .wi-fog {
color: #999;
}
.currentweather .wi-night-clear {
color: #fff;
}
.currentweather .wi-night-rain {
color: #55acee;
}
.currentweather .wi-night-thunderstorm {
color: #ff00ff;
}
.currentweather .wi-night-snow {
color: #fff;
}

.weatherforecast .wi-sunrise {
color: #ffd700;
}
.weatherforecast .wi-sunset {
color: #ffa500;
}
.weatherforecast .wi-day-sunny {
color: #ffff00;
}
.weatherforecast .wi-night-showers {
color: #55acee;
}
.weatherforecast .wi-degrees {
color: #415;
}
.weatherforecast .wi-rain {
color: #55acee;
}
.weatherforecast .wi-showers {
color: #55acee;
}
.weatherforecast .wi-night-showers {
color: #55acee;
}
.weatherforecast .wi-night-alt-cloudy-windy {
color: #aaa;
}
.weatherforecast .wi-night-cloudy {
color: #aaa;
}
.weatherforecast .wi-cloudy {
color: #aaa;
}
.weatherforecast .wi-day-cloudy {
color: #aaa;
}
.weatherforecast .wi-cloudy {
color: #aaa;
}
.weatherforecast .wi-cloudy-windy {
color: #aaa;
}
.weatherforecast .wi-showers {
color: #55acee;
}
.weatherforecast .wi-thunderstorm {
color: #ff00ff;
}
.weatherforecast .wi-snow {
color: #fff;
}
.weatherforecast .wi-fog {
color: #999;
}
.weatherforecast .wi-night-clear {
color: #fff;
}
.weatherforecast .wi-night-rain {
color: #55acee;
}
.weatherforecast .wi-night-thunderstorm {
color: #ff00ff;
}
.currentweather .wi-night-snow {
color: #fff;
}

.region.fullscreen {
  position: absolute;
  top: -20px;
  left: -20px;
  right: -20px;
  bottom: -20px;
}

where should i put ?

 .MMM-Globe {
z-index: 2;
position: relative;
}

everywhere I tried it, it´s not working :see_no_evil:

]]>https://forum.magicmirror.builders/post/13582https://forum.magicmirror.builders/post/13582Sat, 04 Feb 2017 16:15:28 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Sat, 04 Feb 2017 16:06:01 GMT]]>@Niggich @schlachtkreuzer6

can you test

.MMM-Globe {
z-index: 2;
position: relative;
}

if this is not working i will download the module and debug it myself

]]>https://forum.magicmirror.builders/post/13581https://forum.magicmirror.builders/post/13581Sat, 04 Feb 2017 16:06:01 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Sat, 04 Feb 2017 15:59:09 GMT]]>not working for me too

]]>https://forum.magicmirror.builders/post/13579https://forum.magicmirror.builders/post/13579Sat, 04 Feb 2017 15:59:09 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 03 Feb 2017 19:10:52 GMT]]>no, it is not working… I try -1, also -20 and -50

]]>https://forum.magicmirror.builders/post/13466https://forum.magicmirror.builders/post/13466Fri, 03 Feb 2017 19:10:52 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 03 Feb 2017 18:55:30 GMT]]>@Niggich when you set it to two it will be above all, you have to set a lower value than the other have like -1

]]>https://forum.magicmirror.builders/post/13462https://forum.magicmirror.builders/post/13462Fri, 03 Feb 2017 18:55:30 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 03 Feb 2017 18:51:52 GMT]]>Like:

/*****************************************************
 * Magic Mirror                                      *
 * Custom CSS                                        *
 *                                                   *
 * By Michael Teeuw http://michaelteeuw.nl           *
 * MIT Licensed.                                     *
 *                                                   *
 * Add any custom CSS below.                         *
 * Changes to this files will be ignored by GIT. *
 *****************************************************/

 body {
 	
}
.compliments .xlarge {
    font-size: 40px;
    line-height: 40px;
    letter-spacing: 0px;
    font-weight: 400;
}
.calendar {
	width: 100%;
	font-size: 15px;
}	
.MMM-FRITZ-Box-Callmonitor {
	width: 90%
}
.currentweather {
	width: 100%
}
.weatherforecast {
	width: 100%
}
.MMM-DWD-WarnWeather {
	width: 100%
}
.MMM-Globe {
z-index: 2;
}
]]>https://forum.magicmirror.builders/post/13460https://forum.magicmirror.builders/post/13460Fri, 03 Feb 2017 18:51:52 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 03 Feb 2017 18:46:57 GMT]]>@Niggich how does your custom.css look like

]]>https://forum.magicmirror.builders/post/13459https://forum.magicmirror.builders/post/13459Fri, 03 Feb 2017 18:46:57 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 03 Feb 2017 18:43:43 GMT]]>I did, but it’s not working… :-(

]]>https://forum.magicmirror.builders/post/13458https://forum.magicmirror.builders/post/13458Fri, 03 Feb 2017 18:43:43 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 03 Feb 2017 18:41:17 GMT]]>@Niggich ~/MagicMirror/css/custom.css

]]>https://forum.magicmirror.builders/post/13457https://forum.magicmirror.builders/post/13457Fri, 03 Feb 2017 18:41:17 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Fri, 03 Feb 2017 18:38:09 GMT]]>Hello,
I’m sorry, but where I have to change the Settings to arrange the layers?

]]>https://forum.magicmirror.builders/post/13456https://forum.magicmirror.builders/post/13456Fri, 03 Feb 2017 18:38:09 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Thu, 12 Jan 2017 07:00:17 GMT]]>thanks! Works like a charm now!

]]>https://forum.magicmirror.builders/post/10908https://forum.magicmirror.builders/post/10908Thu, 12 Jan 2017 07:00:17 GMT<![CDATA[Reply to layer definition: here MMM-Globe overlaps left panel on Thu, 12 Jan 2017 06:55:01 GMT]]>Yes, using z-index on the modules you can arrange the layers.

Like

.MMM-Globe {
z-index: 2;
}

Will put the globe module above everyother module, you can also apply this to regions.

]]>https://forum.magicmirror.builders/post/10907https://forum.magicmirror.builders/post/10907Thu, 12 Jan 2017 06:55:01 GMT