愚蠢的HTML放置问题:强制一个元素低于另一个元素？

Question

我的基本布局是这样的:

<table>
...
</table>
<table>
...
</table> // There's actually five tables, but that's irrelevant
<img .../>
</body>

我试图将图像变成页脚,在所有表格下面,但我能管理的最好的是它会卡在桌子的右边(我的屏幕很大,所以它可能会在桌子下方为你包裹,但不适合我)或者我可以通过使用position:absolute将它放在桌子顶部.我不能为了我的生活而把图像强行包裹在桌子下面.

我已经尝试将图像包装在div中并将各种属性/属性组合添加到div中,但就像我说的那样,它们都会产生上面列出的两个不良结果中的一个.

任何人都可以提供某种解决方案吗？

我已经看到了一些其他的SO问题,例如如何强制div出现在下面而不是另一个？,但我根本不理解这个解决方案(如何浮动:左边强迫某些东西低于其他东西？)而且我也不相信解决方案需要额外的包装<div>.

Answer 1

<div>
<table>
...
</table>
<table>
...
</table>

</div>
<div style="clear:both;">
<img .../>
</div>

</body>

或使用CSS.并为img或div标签创建样式.

Answer 2

在包含表的最后一个div之后,只需添加:

<div style="clear:both"></div>

它工作:)你的div正在使用float: left因此你必须把一个div告诉它停止所有这些浮动!