[marcuslind]

Hallå WN'are!

Håller på att sätta ihop en ny design med XHTML och CSS. Är i stort sett klar utöver menyn som ska se ut såhär http://data.fuskbugg.se/skalman01/--Bild%2014.png enligt designen.

Menyn ska vara dynamisk, man ska kunna skapa sidor och ta bort sidor. Namnen på varje sida kan vara långa ord som "Vårat sortiment" eller "Hem". Därav att jag inte valt att köra display: block och sedan en bakgrund på det. Isåfall skulle ju bakgrunden vara lika lång eller kort på alla knappar och inte anpassad efter namnet på länken.

Min idé var att köra med CSS pseudoelementen :before och :after.

Jag har kört #menu a:hover:before{content: url(bildnamn.png);} och samma sak på :after. Resultatet blir följande: http://data.fuskbugg.se/skalman01/Bild%2015.png .

Alltså, bilderna från content: url(); trycker ner länken under dom. Jag har försökt med att positionera upp texten med padding och margin, jag har försökt att göra avståndet mellan bilderna och texten större med margin för att se om den trycks ner för att den inte får plats emellan...

Mitt problem är alltså positioneringen av dessa pseudoelement. De ska inte trycka ner texten på det där sättet och nu har jag försökt lite för länge och vänder mig därför hit!