Question

我有一个CSS问题

CSS

img[align="left"] {
display: block;
float: left;
}

HTML

<p>
 <img class="alignleft wp-image-48 size-thumbnail" src="http://url.com/en/wp-content/uploads/2013/08/jamones-secando-150x150.jpg" alt="jamones-secando" width="150" height="150">
 <img class="alignleft size-thumbnail wp-image-50" src="http://url.com/en/wp-content/uploads/2013/08/queso_curado-150x120.jpg" alt="queso_curado" width="150" height="120">
 <img class="alignleft size-thumbnail wp-image-49" src="http://url.com/en/wp-content/uploads/2013/08/embutidos-150x150.jpg" alt="embutidos" width="150" height="150">

请检查此网址http://goo.gl/R0CgpR

在页面中间的单行上有3张图像。

父P标签高度保持为零。所以下一段正对齐图像。所以我必须在接下来的5行上手动放置一个点，以使下一段落在图像的正下方。

这是我可以通过CSS修复的东西，而不是使用点？

Answer 1

您只需将overflow：auto添加到包含图片的<p>，然后移除所有<p>.</p>

<p style="text-align: center; overflow:auto">
     <img class="alignleft wp-image-48 size-thumbnail" src="http://poqueira.com/en/wp-     content/uploads/2013/08/jamones-secando-150x150.jpg" alt="jamones-secando" width="150" height="150">
     <img class="alignleft size-thumbnail wp-image-50" src="http://poqueira.com/en/wp-content/uploads/2013/08/queso_curado-150x120.jpg" alt="queso_curado" width="150" height="120">
     <img class="alignleft size-thumbnail wp-image-49" src="http://poqueira.com/en/wp-content/uploads/2013/08/embutidos-150x150.jpg" alt="embutidos" width="150" height="150">
</p>

Answer 2

尝试将overflow: hidden;添加到p元素样式

<p style="text-align: center; overflow:hidden">
     <img class="alignleft wp-image-48 size-thumbnail" src="http://poqueira.com/en/wp-     content/uploads/2013/08/jamones-secando-150x150.jpg" alt="jamones-secando" width="150" height="150">
     <img class="alignleft size-thumbnail wp-image-50" src="http://poqueira.com/en/wp-content/uploads/2013/08/queso_curado-150x120.jpg" alt="queso_curado" width="150" height="120">
     <img class="alignleft size-thumbnail wp-image-49" src="http://poqueira.com/en/wp-content/uploads/2013/08/embutidos-150x150.jpg" alt="embutidos" width="150" height="150">
</p>

CSS Image父P标签高度保持为零

2 个答案: