Jeg har problemer med at style en navigations-bar tilfredsstillende.
Den er opbygget af 3 stumper grafik - højre/venstre hjørne og en generisk baggrund.
Den skal bruges i forbindelse med et CMS, som spytter menuen ud som <li> elementer.
Den nemme løsning ville være at lave en ekstra <li> før og efter de egentlige menupunkter, men da det er et CMS er markup'en gemt inde i en applikation der genererer menupunkterne og den vil jeg rigtig gerne undgå at modificere.
Derfor leder jeg efter en måde at få det til at gå op kun vha. CSS.
Jeg har forsøgt et par forskellige approach'es. Det jeg er nået længst med er følgende:
http://amok-adhoc.com/navigation-test/navigation.htmlJeg har brugt pseudo-classerne before/after og content:url til at indsætte grafikelementerne hhv. før og efter min <ul>
Baggrunden har jeg indsat på <ul> uden noget pseudo-snask, men hvordan får jeg den til at kun at have samme bredde som de <li> elementer den indeholder?
Og hvordan får jeg rykket teksten opad ift. hvor den står nu. Jeg ville tro jeg skulle bruge padding-bottom, men den repeater bare grafikken nedad?