CSS: Fix rząd wysokość

Question

Mam ten znaczników:

<style> 
    table 
    { 
     border:1px solid black; 
     width:400px; 
     height:300px; 
     border-collapse:collapse; 
    } 
    table tbody 
    { 
     border:1px solid red; 
    } 
    table td 
    { 
     background:yellow; 
     padding:10px; 
     border-bottom:1px solid green; 
     height:20px; 
    } 
</style> 


<table> 
<tbody> 
    <tr><td>test</td></tr> 
    <tr><td>test</td></tr> 
</tbody> 
</table> 

Co potrzebne jest, że wiersze nie potrwają wysokości. Czy istnieje sposób na ustalenie wysokości wiersza?

Answer 1

HTML Wysokości wierszy tabeli zwykle zmieniają się proporcjonalnie do wysokości stołu, jeśli wysokość stołu jest większa niż wysokość wierszy. Ponieważ stół wymusza wysokość twoich wierszy, możesz usunąć wysokość stołu, aby rozwiązać problem. Jeśli jest to niedopuszczalne, możesz także podać rzędną wyraźną wysokość i dodać trzeci wiersz o rozmiarze do pozostałej wysokości tabeli.

Inną opcją w CSS2 jest właściwość Max-Height, chociaż może to prowadzić do dziwnych zachowań w tabeli. http://www.w3schools.com/cssref/pr_dim_max-height.asp

.

Answer 2

Nie próbowałem tego, ale jeśli włożysz element div do komórki tabeli, aby w razie potrzeby miał on paski przewijania, możesz wstawić tam, ze stałą wysokością na div i zachować stolik rząd do stałej wysokości.

Answer 3

Można również spróbować tego, czy to jest to, czego potrzebujesz:

<style type="text/css"> 
    .... 
    table td div {height:20px;overflow-y:hidden;} 
    table td.col1 div {width:100px;} 
    table td.col2 div {width:300px;} 
</style> 


<table> 
<tbody> 
    <tr><td class="col1"><div>test</div></td></tr> 
    <tr><td class="col2"><div>test</div></td></tr> 
</tbody> 
</table> 

Answer 4

Wystarczy dodać style="line-height:0" do każdej komórki. Działa to w IE, ponieważ ustawia wysokość linii zarówno istniejącego jak i nieistniejącego tekstu na około 19 pikseli, co zmusza komórki do pionowego rozszerzenia w większości wersji IE. Niezależnie od tego, czy masz tekst, należy to zrobić, aby IE poprawnie wyświetlał wiersze o wysokości mniejszej niż 20 pikseli.