DIV在TD内顶对齐如何做-HTML教程-爱易网页

DIV在TD内顶对齐如何做

日期：2014-05-17　浏览次数：20689 次

DIV在TD内顶对齐怎么做？
下面代码直接能测试：

<html>

<HEAD>
<META http-equiv="content-type" content="text/html; charset=UTF-8" />
</HEAD>
<table width="200px" height="500px" border="1">
<tr>
<td>
<div style="width:200px; height:200px; border:red 1px solid">这里高度随字数改变而改变</div>
</td>
<td>
<div style="width:200px; height:100px; border:blue 1px solid">我要整个蓝色DIV不管怎要样都在这个TD顶部对齐</div>
</td>
</tr>
</table>

</html>

------解决方案--------------------
深夜党来了，在这个DIV的父级td 加 vertical-align:top; 已测试

<html>

<HEAD>
<META http-equiv="content-type" content="text/html; charset=UTF-8" />
</HEAD>
<table width="200px" height="500px" border="1">
<tr>
<td>
<div style="width:200px; height:200px; border:red 1px solid">这里高度随字数改变而改变</div>
</td>
<td style="vertical-align:top;">
<div style="width:200px; height:100px; border:blue 1px solid;">我要整个蓝色DIV不管怎要样都在这个TD顶部对齐</div>
</td>
</tr>
</table>

</html>