Hoi Tom,
Even van beneden naar boven.
... klappen de subitems mooi exact onder hun parent uit ...
In de submenu-styles van
kam.webencoding.nl/c5/ heb je het voorbeeld weliswaar goed gekopieerd, maar je hebt er ook wat dingen aan toegevoegd, zodat het niet 100% goed draait.
Wat ook speelt: in IE7 zit de positie wel goed. Maar los daarvan: als je met de muis in een normale beweging van "Information" naar het submenu "Characters" hovert, floept het submenu weg en kan je er niet op klikken. Alleen als je met een rotgang van het hoofdmenu naar beneden gaat kan je soms het submenu laten staan. Oorzaak: het submenu zit net 1px te laag
Ik dacht aan het volgende:
Code:
#menu ul ul {
...
top: 38px; /* 1px hoger om wegvallen te vermijden */
padding: 0; /* om links goed aan te lijnen */
margin-left: -1px; /* om 't randje precies onder hoofdmenu-item te laten komen */
}
#menu ul ul a {
...
border: 1px solid #666666; /* o.a. om het randje v/h hoofdmenu te handhaven */
}
Dit werkt in Firefox, IE6, IE7, Chrome, Opera en Safari. Moet nog wel even gecheckt worden in IE8 en IE9.
=====
Ik zie in IE6 dat de #contentwrap onder de sidebar duikt! - Dat kan opgelost worden door de #contenwrap en diens kinderen net iets minder breedte te geven:
Code:
#contentwrap {
width: 800px;
}
#menu {
width: 800px;
}
#content {
width: 800px;
}
#footer {
width: 800px;
}
=====
Overigens: in je 15-stappen uitleg rekt de content niet mee met de sidebar...
Dat snap ik niet: ook als ik in er voorbeeld 16/17 nog een stevig voorraadje Lorem's aan toevoeg, gaan de plankjes aan de linkerkant gewoon mee:
knights-nw-f18.htm. Getest in FF, Chrome, Opera, Safari en IE6 en IE7 (resoluties 1024*768 en 1280*1024px > dan gaan andere ook goed).
D.w.z. de (nep-) sidebar rekt prima mee met de content.
En het omgekeerde gaat ook goed: in
voorbeeld 17 rekt de pagina prima mee als er weinig content is en veel sidebar. De content heeft daar weinig uit te rekken, want die heeft geen background-img dat voortgezet zou moeten worden.
Wat gaat er dan mis? Of bedoel je wat anders?
=====
... ging prima.. totdat ik gebruik ging maken van mijn CMS.
Tja, dan wordt het een ander verhaal.
Als je direct werkt, kan je alles doen wat je wilt: met Kladblok en een ftp-uploader.
Maar als je een CMS hebt, moet je je houden aan de regels van het CMS: hoe het template in elkaar zit, en waar je wel of niet bij kunt komen...
Concrete5 ken ik niet, maar als je in het stylesheet kunt komen, kan je ervan maken (naast het bovenstaande), als je een
gecombineerd background-image maakt in de maten zoals die van mijn voorbeeld:
Code:
body {
...
background: black url(images-map/knights-sprite2.png) repeat-y -221px 0;
}
#topleft {
...
background: url(images-map/knights-sprite2.png);
}
#sidebar {
...
background: url(images-map/knights-sprite2.png) no-repeat 0 -200px;
}
#secondwrap {
...
height: auto; /* of de 100% weghalen */
}
Misschien loop je later nog ergens tegenaan waar het CMS tegenwerkt, maar dat zie je dan wel weer.
Met vriendelijke groet,
CSShunter
"Dé grootste en gratis computerhelpdesk van Nederland"
