1

我正在创建一个带有图像的页面，旁边有几个文本块。我不希望文本块换行，因为这看起来很糟糕。但我也不想添加“溢出：隐藏”，因为这看起来很糟糕（特别是，文本块的末尾挂在图像之外）。

我想做的，我不知道怎么做，是强制块在浮动元素下渲染，如果它会溢出。这样，文本块就可以保持在一起（与允许溢出不同）并且它不会挂在结尾处很有趣（例如“溢出：隐藏”）。

这是一些 html 来演示我的问题。

<head>
<style>
.imgclass {background-color:336633;width:100px;color:00000;float:left}
p {overflow:hidden;width:100px}
</style> 
</head>

<div class="imgclass">Pretend there is an image here. Pretend there is an image 
here. Pretend there is an image here. Pretend there is an image here. Pretend 
there is an image here.
</div>

<p>
This is a paragraph.  It looks good next to the pretend image.
</p>

<p>   
This is a paragraph.  It hangs off the pretend image and looks bad.  I wish that 
if the paragraph was too long it would appear under the image.
</p>

有没有办法解决这个问题？也许我不应该使用浮动？

另外：我正在制作一个通用的CSS。我不知道图像会有多大或段落会有多长。

4

1 回答 1

0

这是更新 - css

.imgclass {background-color:336633;width:100px;color:00000;float:left}
p {
    width:100%;
}
.long{
    clear: left;
}

html

<div class="imgclass">Pretend there is an image here. Pretend there is an image 
here. Pretend there is an image here. Pretend there is an image here. Pretend 
there is an image here.
</div>

<p>
This is a paragraph.  It looks good next to the pretend image.
</p>

<p class="long">   
This is a paragraph.  It hangs off the pretend image and looks bad.  I wish that 
if the paragraph was too long it would appear under the image.
</p>
于 2013-06-25T11:21:48.930 回答