Liebe Foren-Mitglieder,
nachdem ich nun dem Rat von ciaobello gefolgt bin, gelesen habe und mir in eigener Dummheit letztendlich das Layout und alles Drumherum "zerschossen" habe, steh ich nach einem "Neustart" wieder vor einem Problem - Für viele von euch sicherlich nur ein müdes Lächeln wert - Ich raufe mir die Haare! *lach*
Soweit gefällt mir diese Seite schon mal - das einzige, was ich einfach nicht hinbekomme ist, dass das Navigationsmenü oben (auf Höhe) des Artikels anfängt und unten mit dem Artikel aufhört, egal, wie lang der Artikel ist. So soll also die BG-Farbe, bzw. das BG Bild der Navigation bis auf den unteren Rand des Artikels (Artikel-Ende) ausgedehnt werden.
Vielleicht habe ich ja einfach nur einen Denkfehler bezüglich von %-Angaben in Bezug auf responsives Design?
Firebug sagt mir, dass es ein "left", "left.inside" , "mod_navigation" und "mod_navigation block" gibt... sämtliche Veränderungen, die ich dort vornahm, zeigten keinerlei Erfolg. Geladen werden sollen eigentlich die Default.css und die mobile.css - dass ich teilweise zwischen beiden im BE hin-und herspringen muss, hab ich schon bemerkt .
Vielleicht hat jemand eine Idee, was ich bisher übersehen haben könnte, um das Navigations-Menü, zumindest im Desktop-Screen "anzunageln"? (wenn ich dies Seite im "mobile" anschaue, kann ich eigentlich mit der derzeitigen Darstellung schon mal leben... Auch wenn`s später eines Feinschliffes bedarf )
Ich hoffe, jemand hat den richtigen Stubs für mich..
Code:
....
body {
background-color:#7ea7b;
background-repeat:repeat;
font:12px Helvetica,Arial,sans-serif;;
color:#4d4949;
}
#wrapper {
max-width:100%;
}
Container (left + main)
#container {
height:100%;
}
Hauptbereich - Artikel
#main {
min-height:445px;
max-height:100%;
position:relative;
margin-top:0;
margin-bottom:10px;
padding-top:5px;
}
#main .inside {
height:50%;
min-height:450px;
max-height:100%;
margin-left:5px;
background-color:#fff;
font:12px Helvetica,Arial,sans-serif;;
color:#363535;
}
#left {
height:100%;
min-width:195;
min-height:450px;
max-width:195;
max-height:1200px;
top:5px;
position:relative;
margin-top:0;
margin-bottom:10px;
padding-top:5px;
padding-bottom:5px;
}
#left .inside {
height:100%;
min-height:430px;
max-height:100%;
bottom:0;
top:0;
position:relative;
}
#top_image {
margin-top:10px;
margin-left:200px;
}
.....
.mod_navigation {
height:100%;
min-width:195px;
min-height:450px;
max-width:295px;
max-height:1200px;
position:relative;
margin-top:5px;
padding-top:15px;
background-color:#cfcaca;
background-image:url("files/Heilsteine+Reiki/navi_links.jpg");
background-repeat:repeat-y;
z-index:999;
}
.mod_navigation ul {
margin:0 5px;
padding:0;
border-bottom:1px solid #$brown;
list-style-type:none;
}
.mod_navigation li {
margin:0;
padding:5px 0;
border-top:1px solid #$brown;
list-style-type:none;
}
Hover-Effekt im Menü - Farbänderung
.mod_navigation a:hover {
font-size:14px;
font-weight:bold;
color:#0e689c;
}
Farbe des aktuellen Menüpunktes
.mod_navigation span.active {
font-size:14px;
font-weight:bold;
font-style:italic;
color:#147e87;
}
.mod_navigation .level_2 {
padding:3px 0 0 9px;
border-bottom:0px;
}
.mod_navigation .level_2 li {
padding:0 0 3px;
border-top:0px;
}
.mod_navigation a,
.mod_navigation li,
.mod_navigation span {
font-size:14px;
font-weight:bold;
color:#000;
}
.mod_navigation .level_2 a,
.mod_navigation .level_2 li,
.mod_navigation .level_2 span {
font-size:12px;
font-weight:normal;
}
Danke schon einmal im Voraus, der Berliner.
Lesezeichen