webForumDet fria alternativet

Vertical-align vill inte fungera som det är tänkt

HTML & CSS

2 svar · 343 visningar · startad av dectgap

Medlem sedan sep. 20021 655 inlägg
Frågan#1

Jag försöker sätta vertical-align: bottom i en div, för att få ner texten till divens nederkant, men ingenting händer.

Koden ser ut som följer:

<html>
<head>
<style type="text/css">
div.menyRubrik{
 vertical-align: middle;
 width: 125px;
 height: 23px;
 background-image: url("../warcraft/images/design/rub1.gif");
 text-align: left;
 padding-right: 15px;
 border: solid 1px #ffffff;
}

body{
 background-color: #000000;
 color: #feffe0;
 margin-left: 0;
 background-image: url("images/design/bak3.jpg");
 text-align: center;
 font: 60% Verdana;
}
</style>
</head>

<body>
<div class="menyRubrik">o</div>
</body>
</html>

och sidan kan beskådas här:
http://roslund.d2g.nu/mattias/arbetsplats/wow.html

Jag är tacksam för all hjälp.

Medlem sedan dec. 2000557 inlägg
#2

Det fungerar tyvärr inte på det sättet som du önskar..
vertical-align skall tilldelas på inline-element och ex. tabeller.

ex. på bilder och länkar för att sätta dessa i align gentemot elementen runt omkring..

Läs mer om detta här:
http://www.w3.org/TR/CSS21/visudet.html#propdef-vertical-align

Medlem sedan aug. 2000359 inlägg
#3

Testade en gång att skapa två nästlade divar, en med display:table och en med display: table-cell. Då funkade vertical-align i den sistnämnda diven i Mozilla. Däremot inte i Internet Explorer.

277 ms totalt · 4 externa anrop · v20260731065814-full.6fe65c25
153 ms — deklarationer (db)
0 ms — hämta statistik (cache)
122 ms — hämta tråd, inlägg och bilagor (db)
125 ms — ändringar (db)