Autor Zpráva
tomas_vlcek
Profil
Dobrý den, potřeboval bych prosím poradit, jak přesně udělat vertikální zarovnání textu v buňkách tabulky. Děkuji.

<table border="0">

<style>
td a { width: 100%; height: 100%; text-align: center; background-color: blue; display: block}
td a { color: yellow; font-size: 20px; font-weight: bold }  
td a:hover { background-color: yellow; color: blue; font-weight: bold }
a {text-decoration: none}
</style>



<TR>
<TD width="300" height="50"><a href="http://www.idnes.cz">PÁTEČNÍ KURZY 18-21 h</a></TD>  
<TD width="300" height="50"><a href="http://www.idnes.cz">PÁTEČNÍ KURZY 18-21 h</a></TD>  
<TD width="300" height="50"><a href="http://www.idnes.cz">PÁTEČNÍ KURZY 18-21 h</a></TD>  
<TD width="300" height="50"><a href="http://www.idnes.cz">PÁTEČNÍ KURZY 18-21 h</a></TD>  
</TR>

</table>
Mari94
Profil
Pokud bude výška tabulky pořád 50px a velikost fontu 20px, zkuste přidat pro "td a" padding-top:15px;
Tedy CSS
table {
    border:none;
}
td {
    width:300px;
    height:50px;
}
td a {
    width:100%;
    height:100%;
    text-align:center;
    background-color:blue;
    display:block;
    text-decoration:none;
    color:yellow;
    font-size:20px;
    font-weight:bold;
    padding-top:15px;
} 
td a:hover {
    background-color:yellow;
    color:blue;
    font-weight: bold;
}

HTML
<table> 
<tr>
<td><a href="http://www.idnes.cz">PÁTEČNÍ KURZY 18-21 h</a></TD>  
<td><a href="http://www.idnes.cz">PÁTEČNÍ KURZY 18-21 h</a></TD>  
<td><a href="http://www.idnes.cz">PÁTEČNÍ KURZY 18-21 h</a></TD>  
<td><a href="http://www.idnes.cz">PÁTEČNÍ KURZY 18-21 h</a></TD>  
</tr>
</table>
Monkeys
Profil *
tomas_vlcek:

td { vertical-align:middle; }
Trejpa
Profil
tomas_vlcek:
Minule ti odpověď nestačila? Asi ne, používáš víceřádkový text.
Je třeba přetypovat odkaz na buňku tabulky: ukázka - kód

Mari94:
A když se písmo zalomí na dva řádky, jaký bude padding?

Monkeys:
To se ale na odkaze ani jeho obsahu uvnitř buňky neprojeví, když zabírá celou její výšku.


tomas_vlcek:
Značka <style> nepatří dovnitř tabulky, ale do elementu hlavičky HEAD.
tomas_vlcek
Profil
Monkeys, Mari94:
Moc, díky. Toto jsem přesně potřeboval. tomas_vlcek, Mari94


tomas_vlcek:
Potřeboval bych prosím ještě poradit, jak to udělat, aby jenom ta levá buňka měla třeba červené pozadí, ostatní buňky zůstaly modré.
Bubák
Profil
Třebas takto, pokud nevadí nefunkčnost v dnes už historicky cenném IE6:
td:first-child a    {background: red;}



Nikdy nezakládej duplicity, nikdy!!!

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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