CSS dropdown menu: 2 kritische puntjes

[Travee]

Hey mensen. Ik ben bezig met een website en begin het aardig onder de knie te krijgen. Vandaag heb ik voor het eerst een transparant menu uitgeprobeerd. Ik heb het zo ver gekregen dat alles er gaaf uit ziet! Er is echter nog 1 kleine foutje die ik graag veranderd zou willen hebben:
[EDIT: probleempje 2 is opgelost!]

• [hr]
• 1 Als ik op het topmenu ga staan (link: nieuws) dan komt daaronder netjes een transparant blok. Dit is het probleem: als ik over dat transparante blok ga dan verdwijnt het hoverplaatje van de hoofdbutton (in dit geval nieuws dus). Ik wil dat dit plaatje actief blijft. Er is hier vast een kleine oplossing voor maar ik weet niet hoe zoiets heet en dat zoekt dan lastig.
  

  ---

Dit is de CSS van mijn menu: (heb suckerfisch menu als basis gebruikt).

code:

/* hoofdbuttons */
a.mainlevel-son-of-suckerfish-horizontal, a.mainlevel_active-son-of-suckerfish-horizontal, a.mainlevel_current-son-of-suckerfish-horizontal,
a.mainlevel-son-of-suckerfish-horizontal:link, a.mainlevel_active-son-of-suckerfish-horizontal:link, a.mainlevel_current-son-of-suckerfish-horizontal:link,
a.mainlevel-son-of-suckerfish-horizontal:visited, a.mainlevel_active-son-of-suckerfish-horizontal:visited, a.mainlevel_current-son-of-suckerfish-horizontal:visited {
    background: url(../images/nav.jpg) repeat-x;
    color: #FFFFFF;
}

/* hover hoofdbuttons */
a.mainlevel-son-of-suckerfish-horizontal:hover, a.mainlevel_active-son-of-suckerfish-horizontal:hover, a.mainlevel_current-son-of-suckerfish-horizontal:hover {
    background: url(../images/hover.jpg) repeat-x;
    color: #FFFFFF;
}

/* subbuttons */
a.sublevel-son-of-suckerfish-horizontal, a.sublevel_active-son-of-suckerfish-horizontal, a.sublevel_current-son-of-suckerfish-horizontal,
a.sublevel-son-of-suckerfish-horizontal:link, a.sublevel_active-son-of-suckerfish-horizontal:link, a.sublevel_current-son-of-suckerfish-horizontal:link,
a.sublevel-son-of-suckerfish-horizontal:visited, a.sublevel_active-son-of-suckerfish-horizontal:visited, a.sublevel_current-son-of-suckerfish-horizontal:visited {
    background: #16325C;
    color: #FFFFFF;
    filter:alpha(opacity=80);
    -moz-opacity:.8;
}

/* hover subbuttons */
a.sublevel-son-of-suckerfish-horizontal:hover, a.sublevel_active-son-of-suckerfish-horizontal:hover, a.sublevel_current-son-of-suckerfish-horizontal:hover {
    background-color: #F4FAF5;
    color: #589600;
    filter:alpha(opacity=80);
    -moz-opacity:.8;
}

[ Voor 64% gewijzigd door Travee op 27-03-2008 05:44 ]

[RobIII]

Een hele lap CSS posten voor deze kleine probleempjes is natuurlijk onzin. We zien hier in WEB graag dat je enkel relevante code post en de daarbijbehorende relevante HTML. Dat houdt in dat je het beste een "uitgeklede" test-case kunt maken. Daarmee zet je alles voor jezelf nog eens op een rijtje en daarbij hoeven wij dan niet meer door allerlei CSS heen te worstelen die niets met je probleem te maken heeft.

Ook mis ik nogal wat je zelf al hebt geprobeerd. Je topic is nu: "Ik ben bezig met een site, link, ik heb deze 2 problemen en *dump* dit is mijn code". Zoals je in onze Quickstart (puntje 3 en 4) en in Kan iemand even...? zult lezen is dat niet echt de bedoeling hier.

Ik verzoek je dan ook vriendelijk even je TS aan te passen op voorgenoemde punten zodat we toch nog een constructief topic hiervan kunnen maken zonder dat je opmerkingen gaat krijgen over niet-ertoe-doende bijzaken* of "wat heb je zelf al geprobeerd?".

Dan een tip: installeer de webdeveloper toolbar voor FF (http://chrispederick.com/work/web-developer/) eens; daarmee kun je relatief snel achterhalen waar je probleem zit als bijvoorbeeld alle floats eens outlined:

Ook het juist indenten (inspringen) van je code maakt het geheel een stuk leesbaarder. En waarom gebruik je tables voor de paar blokjes tekst? (*zie je? nu krijg je opmerkingen over tables terwijl dat voor je probleem geen drol uitmaakt )

offtopic:
mainlevel-son-of-suckerfish-horizontal is als classname nou niet echt een geschikte naam denk ik; waarom kies je niet iets korters en beschrijvenders?

[ Voor 22% gewijzigd door RobIII op 23-03-2008 10:12 ]

[Travee]

Oke ik heb de TS aangepast. Zo zie je maar weer dat elk forum weer zijn eigen wensen heeft

Ik zal die webdeveloper toolbar eens downloaden want mbv dat plaatje wordt alles een stuk duidelijker voor anderen, bedankt. Op dat plaatje kun je goed zien dat de outlines te ver naar beneden zitten. Ik heb de fout nu gevonden dus dat kan weg uit de TS

Over de wat lange code: ik heb niet alles zelf geschreven. De oorspronkelijke code was nog langer. Tables: --> joomla.

[ Voor 17% gewijzigd door Travee op 24-03-2008 01:11 ]

[Verwijderd]

Wow, dat is een goeie tip, van dat web-developer.

Weet iemand of er ook zoiets dergelijks is voor IE?

[RAJH]

Je zou de Internet Explorer Developer Toolbar van Microsoft kunnen proberen.

[ Voor 10% gewijzigd door RAJH op 25-03-2008 15:16 ]

[Travee]

Ja hij is handig!

Iemand die weet hoe ik de parentbutton actief houdt wanneer er met de muis over het submenu gegaan wordt?