CSS 问题，100% 宽度不断移动答案

【问题标题】：CSS problem, 100% width keeps moving out of positionCSS 问题，100% 宽度不断移动
【发布时间】：2011-10-29 21:20:45
【问题描述】：

我目前正在开发这个网站， http://no-illusions.nl 一切顺利，但我发现了一个我无法解决的非常愚蠢的事情。

我有一个宽度为 500 像素的 div（包装器），在里面我有不同的 div，其中包含图像和文本。现在的问题是文本的宽度是动态的，在某些部分可能是 200px 宽度，而在某些页面上可能是 350px。

所以我将宽度设置为 100%，但现在部分只是浮在我想要的位置下方！

这就是它应该的样子， ![它应该是什么样子][1]

但这就是它的样子，

我希望你们能给我一个正确的方向。

【问题讨论】：

【解决方案1】：

请记住，相对大小是相对于包含元素的。如果你说width: 50%，你会得到一个为其容器宽度 1/2 的元素。所以你说width: 100% 使文本div 占据了容器宽度的100%，它也变成了500px。

您可以将图像放在文本 div 中并使其浮动。使用适当的边距/填充，文本将环绕图像，您会得到如下内容：

imgimgimg   text text text 
imgimgimg   text text text
imgimgimg   text text text

text text text text text
text text text text text

基本的 html 结构是：

<div style="width: 500px;">
    <div style="float: left; margin: 5px;"><img src="..."></div>
    text text text text text
</div>

否则，您需要使用固定 div，并根据是否存在图像动态更改文本 div 的宽度。 if (has image) { width: 350} else { width: 500} 事物的类型。

【讨论】：

【解决方案2】：

这一直困扰着我，我通常通过设置段落的最大宽度来解决它。这应该导致文本在该宽度内换行。

【讨论】：

【解决方案3】：

您可以在 .update_respond 类上设置 330px 的最大宽度。

【讨论】：

【解决方案4】：

<p>-tags 根本不需要任何宽度，因为它们是块元素，可以拉伸到可用的最大宽度。

【讨论】：

【解决方案5】：

.update_respond p{width: 273px;}

【讨论】：