<!doctype html>
<html>
<body>
<table style="float:left;margin-left:20px;width:120px">
<tr><td style="background-color:#EBEBF5;">Profile Info >> </td></tr>
<tr><td>Entertainment</td></tr>
<tr><td>Sports & Fun</td></tr>
<tr><td>Add More </td></tr>
</table>
<table style="width:200px">
<tr><td>info</td><td>Education</td><td>Work</td></tr>
</table>
</body>
</html>
浏览器窗口最大化时的样子
Profile Info >> info Education Work
Entertainment
Sports & Fun
Add More
然后我把我的浏览器窗口最小化，越来越小到顶峰，现在是这个样子
Profile Info >>
Entertainment
Sports & Fun
Add More
info Education Work
信息、教育和工作都回到底部添加更多为什么？为什么当我使用 float:left 时 width 属性不起作用？当我使用 float:left 属性时如何处理？
最佳答案
发生这种情况是因为您 float 了整个表格，并且您的“添加更多”行是主表格的一部分。如果没有足够的空间容纳它们，第二张 table 将在下面显示，如您所见。如果您不希望它换行，那么您需要将所有内容都换行到一个设置了 min-width 的 div 中。
<div style="min-width: 400px;">
<!--INSERT YOUR TABLES HERE -->
</div>
关于css - 无法处理 Float :left property，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7718666/