vertical spry-menu

[robert86]

Hoi,

Ik probeer een verticale spry-menu te maken. Nu wil ik graag het menu zo maken dat de onderkant van de eerste regel button, de bovenkant van de tweede button raakt. De button moet dus precies even hoog zijn als de tekst. Nu krijg ik dit echter niet voor elkaar. Ik krijg de witte ruimte boven de tekst niet weg.

Principe is hier te zien:

http://www.templatehelp.com/preset/pr_preview.php?i=31011&pr_code=z6kE3jSbnYztA9KlWlwRj8Cb702DWV


Ik heb al uren van alles geprobeerd, maar ik kom er niet uit!!! Help mij alsjeblieft!!!

 

[csshunter]

Hoi robert86,
Mmm, ze doen het daar door een vaste hoogte van de list-items li {height: 68px;}, gecombineerd met in de links een vaste letterhoogte {font-size: 95px;}, een vaste regelhoogte {line-height: 95px;} en een vaste verschuiving omhoog {top: -13px;}...

... maar dat kan verschrikkelijk fout gaan als je niet Internet Explorer gebruikt, maar bv. Firefox. Als de bezoeker een andere lettergrootte inschakelt, kunnen de regels toch los van elkaar komen, of -erger- door elkaar heen gaan lopen.
Bovendien is het link-oppervlak (waarop geklikt kan worden) net iets anders dan de letters: als je er met de muis overheen gaat, begint en eindigt het klik-oppervlak van een regel steeds een stukje hoger dan die regel zelf.

• Ik kan me dus goed voorstellen dat het je niet lukt.

De makkelijkste oplossing is om helemaal geen teksten in de links te gebruiken, maar afbeeldingen van de teksten. Die kunnen evengoed een hover-effect krijgen, en die kunnen wel altijd precies bovenop elkaar gestapeld worden.
(Blijft over de vraag: is het nog wel een beetje leesbaar, zo'n letterstapel?)

Met vriendelijke groet,
CSShunter

 

[robert86]

thanks!!

Ik ga er mee aan te slag, hoop dat het me zo wel gaat lukken.