css - 将宽度设置为 100%

Question

我的布局看起来像这样:

代码如下: http://jsfiddle.net/redconservatory/L8tBk/

基本上，左侧有一个向左浮动的 div，因此文本和按钮最终位于图像的右侧(也向左浮动)。

但是，为了让它工作，我必须在内部 div 上设置宽度，否则 div 将 float 在图像下方。

这一切都很好，直到用户不上传图片，然后我得到的是这样的:

http://jsfiddle.net/redconservatory/dr3FG/

文本只占据容器的一部分，而不是填满整个容器。

有什么办法解决这个问题吗？我希望文本占据大部分容器...

Answer 1

是的 - 我建议您了解 Nicolle Sullivan 的“媒体元素”http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/

本质上:

img { float: left; }
.description { overflow: hidden; }

现在，如果有图像就可以，如果没有，也可以。从您的描述中删除宽度和 float 。使用填充以获得所需的效果，或在图像上留出边距。