2012-03-13 4 views
0

테이블에 4 <td>이 있고 각 <td>에는 1 픽셀 테두리가 있습니다. 모든 사업부에는 본문 "My Division"이 있습니다.TD 높이에 따라 Div 높이 조정

지금 나는 또한하지 않는 다른 3 <td> 3 다른 <div>에 불과 증가하는 <td>에서 다음 그들의 <td><td> 증가의 높이와 <div>의 높이 중 하나에 좀 더 많은 텍스트를 추가 할 때. 증가 된 신장에 따라 높이를 조정하는 방법 <td>.

<table> 
<tr> 
    <td height="50"><div style="border:1px solid;">My Division</div></td> 
    <td height="50"><div style="border:1px solid;">My Division</div></td> 
    <td height="50"><div style="border:1px solid;">My Division</div></td> 
    <td height="50"><div style="border:1px solid;">My Division</div></td> 
<tr> 
</table> 
+0

당신이 몇 가지 코드를 보여줄 수 있습니까? – tkone

+0

My Division
My Division
My Division
My Division
첫 번째 div에 다른 텍스트를 추가하면 td와 div의 높이가 증가하지만 다른 세 divs의 높이는 일정하게 유지됩니다. – manishjangir

답변

0

순수 CSS를 사용하면 tds의 높이가 지정된 경우에만 가능합니다. 그런 다음 divs 높이를 100 %로 만들 수 있습니다. 그러나 그것은 당신이 찾고있는 것이 아닙니다.

문제를 해결하려면 javascript를 사용해야합니다.

0

이 필요한 것입니다 :

#myTable td { 
    vertical-align:top; 
} 

#myTable td div { 
    height:100%; 
} 
​ 

jsFiddle test