Autor Zpráva
maks
Profil
Ahoj, chci vycentrovat třířádkový text ve vysokém bloku vertikálně, použil jsem display: table-cell a vertical-align: middle. Ve FF ok, v IE pořád nahoře.
menu li {
float: left;
width: 100px;
height: 50px;
background: brown;
}

menu li a {
width: 100px;
height: 50px;
background: yellow;
display: table-cell;
vertical-align: middle;
}

a html

<menu>
<li><a href="">krátký text</a>
<li><a href="">dloooooooooooouhý předloooooooooooouhý text na 3. řádky</a>
</menu>


Děkuji za pomoc,
Maks
Fnesveda
Profil
maks
Cituju Jakpsátweb.cz
Další hodnoty vlastnosti display

Výše uvedené hodnoty fungují v Internet Exploreru (nejlépe v 5.5 a 6), v Mozille a Opeře 7. V moderních prohlížečích fungují také další hodnoty vlastnosti display, vhodné zejména pro stylování XML dokumentů. Jde o hodnoty compact, run-in, marker a hodnoty pro tabulkové vykreslení. Pro práci s HTML stránkami kvůli ignoraci Internet Exploreru nemají význam (psáno 2003).

Tabulkové hodnoty fungují v Mozille a Opeře a jejich význam je celkem zřejmý. Jsou to hodnoty: table, table-row-group, table-header-group, table-footer-group, table-cell, table-column, table-column-group, table-caption. Hodnota display: inline-table má udělat tabulku ležící na řádku, ale Mozilla ji vykreslí jako display: table (uvádí Pixy). Používám to např. ve vertikálním centrování.

Jakmile čemukoliv nastavíte float rozdílné od none, stává se to blokovým prvkem (jakoby display: block).


Takže to asi nebude tvoje chyba, nicméně řešení mě nenapadá.
Bubák
Profil
Pokud se nepletu, tak display: table-cell; má uvět až IE8.
Zatím to půžeš udělat takto: http://klient.plavacek.net/centrovani.html
maks
Profil
Bubák
Zatím to půžeš udělat takto: http://klient.plavacek.net/centrovani.html
to se mi bohužel nepodařilo.

<!--[if IE]> 
<style type=&quot;text/css&quot;>
div.image div {     //toto jsem dal k menu li
	width: 100%;
	position:absolute;
	top: 50%;
	left: 0;
}
div p {      // toto jsem dal k menu li a
	position: relative;
	top: -50%
}
</style>


V divech mi to podle ukázky funguje, ale nedaří se mi to nacpat do toho seznamu. Kdyžtak to, prosím, někdo zkuste, jetli se vám podaří napasovat to na seznam.

Děkuji,
Maks
maks
Profil
Tak jsem si s tím hrál dál, ale asi je nad moje síly toto zprovoznit seznamu ul li a..

Nenajde se skutečně nikdo, kdo by zkusil najít v mém zápise chybu? Stylopis jsem nechal tak, jak byl na bubákově odkazu, jen jsem zaměnil div.image div za menu li a div p za menu li a - ve stylech pro IE.

Děkuji,
Maks

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: