Horizontaal CSS menu met 4 kolommen uitlijnen.
Voorbeeld: http://jsfiddle.net/MBaNL/hWHGu/1/
Zoals je ziet werken de 4 kolommen al wel maar blijft het geheel meeschuiven met de bovenliggende <li>. Wat ik wil is dat de tweede sub <ul> net als de eerste sub <ul> links wordt uitgelijnd.
Wat mij verder ook wel netjes lijkt is om het "gat" in het tweede sub-menu rechtsonderin op te vullen door het rood als het ware door te laten lopen. Hoe kan ik dat toepassen binnen CSS?
Aangezien ik na een paar jaar weer php aan het oppakken ben en eigenlijk voor het eerst met HTML5 en (goed(?)) met CSS3 bezig ben kom ik er nog niet helemaal uit en hoop ik dat jullie mij verder kunnen helpen.
Alvast bedankt.
Eigenlijk wil je twee css menu's onder elkaar zoals ik het begrijp. Ik weet niet of dat op deze manier te realiseren is, maar anders kun je zeker met behulp van wat javascript jouw doel bereiken. Met de JQuery library wordt dat nog een stukje makkelijker.
Met dat gat bedoel je wellicht de witte streep tussen de vakken?
Dat zou een border kunnen zijn. je kunt eens border-color:#??????; proberen.
Onthoud dat HTML5 en CSS3 nog beta zijn en nog niet door alle browsers ondersteund worden.
Ik geloof wel dat het de toekomst heeft.
JQuery is iets waar ik momenteel alleen nog maar over aan het lezen b enen voor nu alleen nog toekomstmuziek.
Wat betreft het "gat"... zie onder "heeft sub 2" "sub 8" maar eens. Zoals je ziet is die niet aanwezig omdat die niet is aangemaakt. De vraag is dus hoe kan ik dat "gat" opvullen?
De dotted lijn komt uit het originele ontwerp van dit menu maar heb het (nog) niet gewijzigd aangezien dat wel in het design past.
Het menu zoals in het voorbeeld is wat ik dus nu heb met als enig echt probleem dat het sub-ul wordt uitgelijnd omder de hoofd-ul...
Gewijzigd op 14/02/2013 02:10:27 door M B
M B op 13/02/2013 11:56:58:
Dat heeft iemand met jouw talenten toch niet nodig? Die schrijft toch manueel? ;-)Met een CSS menu van internet (CSSMenuMaker)
M B op 13/02/2013 11:56:58:
Ik zou je aanraden om horizontale drop down-menu's zo te maken dat de submenu's verticaal naar beneden komen. Anders is het erg lastig manoeuvreren met de muis. Als je het daarmee eens bent, heb ik hier een tutorial voor je. Zou voor jou een eitje moeten zijn.Wat ik wil is dat de tweede sub <ul> net als de eerste sub <ul> links wordt uitgelijnd.
Gewijzigd op 14/02/2013 02:49:13 door Frank Conijn