我试图阻止一个表,该表的宽度明确声明不会溢出其父 div
。我想我可以使用 max-width
以某种方式做到这一点,但我似乎无法让它工作。
以下代码(带有一个非常小的窗口)将导致此问题:
<style type="text/css">
#middlecol {
width: 45%;
border-right:2px solid red;
}
#middlecol table {
max-width:100% !important;
}
</style>
<div id="middlecol">
<center>
<table width="400" cellpadding="3" cellspacing="0" border="0" align="center">
<tr>
<td bgcolor="#DDFFFF" align="center" colspan="2">
<strong>Notification!</strong>
</td>
<tr>
<td width="50">
<img src="http://www.example.com/img.png" width="50" height="50" alt="" border="0">
</td>
<td>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</td>
</tr>
</table>
</center>
</div>
红线是 div
的右边框,如果您将浏览器窗口调小,您会发现表格放不下。
原文由 waiwai933 发布,翻译遵循 CC BY-SA 4.0 许可协议
通过执行以下操作来扭转局面:
另外我建议你:
center
标签(已弃用)width
,bgcolor
attributes, set them by CSS (width
andbackground-color
)(假设您可以控制呈现的表格)