在浮动图像旁边放置表格

Posted 2023-03-06

【中文标题】在浮动图像旁边放置表格

【英文标题】：Positioning a table next to a floating image

【发布时间】：2011-12-15 09:04:07

【问题描述】：

我想在浮动图像旁边放置一个表格，同时保持表格的宽度为 100% 并且不超出父元素的宽度。

我尝试了各种技术，但还没有达到我想要的结果。这就是我的意思：http://jsfiddle.net/AX3UR/3/

有什么建议吗？为#container 使用“溢出：隐藏”属性对我来说不是解决方案，因为表行中的基本信息丢失了。

【参考方案1】：

将表格包裹在一个 div 中，并将其向左浮动

查看更新的 jsfiddle http://jsfiddle.net/AX3UR/5/

你的h2也不应该在p中

编辑

我刚刚注意到您想保持表格 100% 的宽度。浮动并不容易。 但是，您可以使用嵌套表，但这有利有弊。

有关嵌套表解决方案，请参阅 http://jsfiddle.net/AX3UR/13/。

【讨论】：

非常感谢！可惜的是，做一件相当简单的事情是如此棘手。

@user1013696 你可以在 CSS3 中更轻松地做到这一点

已经做到了。您想到的替代来源的任何链接？

@Juozas CSS3 display: box hacks.mozilla.org/2010/04/the-css-3-flexible-box-model