CSS自动高度设置不考虑表子元素?

时间:2011-11-24 02:06:44

标签: html css

我正在尝试将一个表放在div中以便于布局。但是只要我将div的高度从固定值更改为'auto',div的高度就会降低到零。这是代码看起来的简化版本。

<div class="box">
    <table>
       <tr>
       <td> <img src="something.jpg" alt=""> </td>
       <td> <p>something<p> </td>
       </tr>
    </table>
</div>

我应该做些什么来拉伸div?这是div的CSS。我真的觉得我错过了一些简单的东西。

.box {
float: center;
margin: 10px 0px 10px 70px;
height: auto;
width: 600px;
text-align: left;
border: 2px solid #e3e2e2; 
border-radius: 5px;
padding: 0px 0px 0px 0px;   
font-size: 25px;
}

感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

<td> <p>something<p> </td>

您要在段落中打开另一个段落,而不是关闭现有段落。这可以在不同的浏览器中产生许多不同的效果,但在这种情况下,它不会影响每个浏览器的最新版本中的任何内容(它可能会影响旧的浏览器)。

除此之外,修复CSS应该可以防止其他错误:

.box {
margin: 10px 0 10px 70px;
height: auto; /* Is this needed? Height is auto by default. */
width: 600px;
text-align: left; /* Is this needed? Text-align is left by default. */
border: 2px solid #e3e2e2; 
border-radius: 5px;
padding: 0;   
font-size: 25px;
}