Hej!
Har en div där jag vill få texten att ligga centeret i lodrätt vinkel. Som det är nu placerar sig texten högst upp oavsett om jag lägger till vertical-align: middle; i diven. Finns det något annat sätt att fixa detta på?
Tack på förhand!
2 svar · 563 visningar · startad av KoTTeN
Hej!
Har en div där jag vill få texten att ligga centeret i lodrätt vinkel. Som det är nu placerar sig texten högst upp oavsett om jag lägger till vertical-align: middle; i diven. Finns det något annat sätt att fixa detta på?
Tack på förhand!
Hmm
vertical-align funkar bara i två fall...
i tabellceller
mot "radhöjden" i inline-text.
kan du lösa t.ex. genom att köra med display:table-cell såhär:
<div style="display:table-cell;height:200px; vertical-align:middle">Foo</div>
.. men du kommer ganska snart att se att detta inte funkar i MSIE (såklart :x)
Så alternativ 2 är att ta till fulingen att meka med line-height t.ex. såhär:
<div style="line-height:200px; vertical-align:middle">Bar</div>
...Vilket är enkelt om man som i mitt exempel har *en* rad text men kräver eftertanke och minst en div eller span till om man skall ha radbrytningar med i spelet ;)
Men kan du tänka dig en div eller en span till så kan du t.ex. göra såhär:
<div style="line-height:200px; vertical-align:middle">
<div style="line-height:1em">B<br>a<br>r</div>
</div>
om du behöver ha radbrytningar i det som centreras vertikalt enligt alternativ 2 ;)
Tack Jarvklo!
Den här gången hade jag faktiskt turen att det enbart rör sig om en enda text rad. :)