图像之间的差距？

http://users.telenet.be/prullen/portfolio.html

我试过我的图片设置为display：block -

display: block; 
margin: 0; 
padding: 0;

，但没有奏效。

我也尝试添加

visiblity:hidden;overflow:hidden;height:0;font-size:1px;line-height:0px

到

<div style="clear:both"></div>

但这些工作。

有谁知道原因可能是什么？如果可能，清除：两者应该保持兼容。

来源

2012-09-07 Wesley

为given page快速修复：添加float:left到.item CSS块。

来源

2012-09-07 18:59:45 alexbusu

或者更好的方法是将'display：inline-block;'放到同一个'.item'元素中。但是你需要保持'width：100％;'css属性。 – alexbusu

为什么display：inline-block更好？我们可以同时拥有（回退）吗？ – Wesley

您必须清除浮动元素后的浮标（某些情况下）。看看[这里]（http://css-tricks.com/all-about-floats/）。 – alexbusu

尽量把他们放在一个div类名 '.row'，并设置行高为0

HTML：

<div class="row"> 
    <img src="img1.png" /> 
    <img src="img2.png" /> 
    <img src="img3.png" /> 
</div>

CSS：

.row { 
    line-height: 0; 
}

来源

2012-09-07 18:55:34

你应在第一个<div>之后加上<div style="clear: both;" />。

Fixed code

你也可以将其删除：

<div style="clear:both;visiblity:hidden;overflow:hidden;height:0;font-size:1px;line-height:0px;"></div>

来源

2012-09-07 18:55:42

似乎这并不做任何事情（固定错字太多）。 – Wesley

我编辑了我的答案它现在可用。 :) –

谢谢，在我的生活中尝试过这一点，但没有工作，然后注意到你也增加了一个浮点到描述类。 – Wesley

如果你在谈论的差距在图像之间的垂直间隙，那么你的问题是在该<p>上边距第二.item .description。这是缩小差距的因素。

.description p { margin-top: 0 }

或者：

<div class="description"> 
    <p class="first">Description goes here.</p> 
</div> 

.description .first { margin-top: 0 }

来源

2012-09-07 18:57:55 tgormtx

工作，泰克。但有没有可能找到div元素中的第一个元素，该元素具有margin-top，并将其设置为零？因为它可能并不总是一个div。 – Wesley

我相信.description：首先，但它不符合跨浏览器。您可以随时使用class =“first” – tgormtx

做你的重置CSS中...

* {填充：0;保证金：0; }

来源

2012-09-07 18:59:45 Brant

您的段落标记是什么导致上下的差距。对于第（铬），默认是：

p { 
display: block; 
-webkit-margin-before: 1em; 
-webkit-margin-after: 1em; 
-webkit-margin-start: 0px; 
-webkit-margin-end: 0px; 
}

简单的页边距设置为0，将解决你的问题：

p { margin: 0px; }

来源

2012-09-07 18:59:49 altschule

的<p>标签的第二个项目是推动整个DIV下降1因为它的默认顶部和底部边距通常是1em。当您将其边距设置为零时，这些项目将排列在彼此之上。您可能需要设置<p>或将<p>设为margin-top: 0px。

来源

2012-09-07 19:05:58

好吧，测试一个作品。

删除clear:both div并将浮动样式设置为第一项。

不好：

<div class="item"> 
    [...] 
    <div style="clear:both;"></div> 
</div> 
<div class="item" style="border:red;"> 
    [...] 
</div>

好：

<div class="item" style="float:left;"> 
    [...] 
</div> 
<div class="item" style="border:red;"> 
    [...] 
</div>

来源

2012-09-07 19:22:15

图像之间的差距？

回答

相关问题