Background img align med tekst

Tags:    html css

Hej forum,

Jeg forsøger at genskabe dette oplæg fra min designer i css:
http://cmstest.ku.dk/grafik/example.jpg

Udfordringen er at skabe en titel over den eksisterende venstre-navigation, som har et farvet element til venstre, som strækker sig lige så højt som teksten gør. Det øverste af teksten skal "klæbe" til toppen af grafikken og det nederste skal "klæbe" til bunden af grafikken.
Jeg kan bare ikke få teksten til at gøre det, og der er mellemrum både over og under teksten.

Jeg arbejder i et testområde her, hvor I kan se projektet indtil nu live:
http://cmstest.ku.dk/

Min css er indtil videre:
Fold kodeboks ind/udKode 


Håber nogen kan hjælpe,

Vh
Anders



Jeg kan se du bruge et 8x1 baggrundsbillede, ville det ikke være en ide med et 1x1 baggrunds billede der gentager sig alt efter hvor høj din #div_nav er?



hvad med:

Border-left: 8px solid #ccc

det burde give ca. det samme... :)



Casper, der er repeat y på mit billede, så det skulle gentage sig afhingig af højden på min div.

Michael, jo det giver det samme resultat og jeg kan bedre li det.

Desværre løser det ikke problemer med at teksten svæver rundt ca. midt i grafikken.
Nogle forslag til hvordan det kan blive løst?



Jeg kan ikke se hvad der skulle se forkert ud. Kan du ikke tage et screenshot og tegne nogle pile og streger?



Hej Jesper,

Jeg har arbejdet mig frem til noget med en ydre div og negative marginer, så jeg er tæt på at have den. Tak for din interesse. Hvis bare så nogen ku foreklare mig hvordan jeg får indholdet i en div, som har min height til at følge div'ens bund i stedet for div'ens top, så ville jeg være glad. Tror jeg opretter en ny tråd.

Tak alle sammen:o)



Hvis bare så nogen ku foreklare mig hvordan jeg får indholdet i en div, som har min height til at følge div'ens bund i stedet for div'ens top, så ville jeg være glad.

Det kan nok gøres med line-height og vertical-align eller med height, display:table og vertical-align, men ingen af dem virker i IE6 og vidst nok heller ikke i IE7. Ellers må man ud i noget position:absolute/relative, men det afhænger af omgivelserne om det kan bruges.



t