[Gelöst] Container innerhalb eines "eigenen Layoutbereiches" nicht voll ansprechbar
Liebe Leser,
durch das Anlegen eines "eigenen Layoutbereiches" per Seitenlayout-Einstellungen wird bekanntlich der CSS-Selektor .custom für diesen Layoutbereich generiert. Woran kann es denn liegen, dass weder die zu einem innerhalb von .custom liegenden Inhaltselement zugehörige Klasse .inside, noch die eigentliche Klasse bzw. ID selbst mit bestimmten Anweisungen per CSS angesprochen werden möchte?
Minimales Beispiel:
HTML:
HTML-Code:
<!DOCTYPE html>
<html lang="de">
<head>
<body id="top" class="win firefox gecko fx38">
<div id="wrapper">
<header id="header">
<div class="custom">
<div id="Navigation_Untermenue">
<div class="inside">
<nav class="mod_navigation block">
</div>
</div>
</div>
<div id="container">
<footer id="footer">
</div>
</body>
</html>
CSS:
Code:
html,
body,
#top,
#wrapper { width: 100%; }
#header,
.custom,
#container,
#footer { width: 100%; }
#Navigation_Untermenue { width: 70%; margin: 0 auto; background: blue; border-top: 4px solid red; }
#Navigation_Untermenue .inside { width: 40%; margin: 0 auto; background: red; border-bottom: 4px solid green }
(Korrekt) funktionsfähiges Beispiel: https://jsfiddle.net/u6ozhk68/1/
Leider reagieren #Navigaton_Untermenue und .inside aus meinem Contao-HTML im Gegensatz zum obigen jsfiddle-Beispiel nicht auf die zugeteilten CSS-Anweisungen bezüglich Farbe und Rahmen, die Breiteneinstellung hingegen funktioniert bei beiden problemlos. Woran liegt das denn? Auch beim Überfahren des jeweiligen Container-HTML's mit Firebug leuchten diese beiden Flächen nicht auf - lediglich .custom und mod_navigation werden von Firebug visualisiert.
Möchte ich den "eigenen Layoutbereich" also z.B. einfärben, dann kann ich dies nur auf den Selektor .custom anwenden, nicht jedoch auf die eigentlichen Inhaltselemente #Navigation_Untermenue und .inside...
Wieder mal ein ganz banaler Denkfehler? :o
Herzlichen Dank für Eure Unterstützung!
Viele Grüße
KloBoBBerLe
