CSS间距问题。需要新鲜的眼睛（应该很容易）

没问题，所以这个小调但很大的烦恼是，我有一个网站即时通讯工作，特别是面板行为奇怪。CSS间距问题。需要新鲜的眼睛（应该很容易）

我有一个通用的盒子div，可以容纳2张图片，其中一个ontop，我希望它们之间绝对没有间距。

问题是无论我做什么，在开发模式下它都表现正常，但是当我发布时，我会看到图像之间的空间。

通常情况下，我不设置宽度/高度等，这取决于我在做什么，但为此...它一直是主要的痛苦，我宣布一切的高度，以确保我不会错过这里或那里几个数字，依然没有。

继承人发生了什么事情的例子。（我的服务器上） http://somdowprod.net/4testing/erase

，如果你看那里，那里有关于顶部的知情同意，并在底部的TST PIC之间的5px的空间无论是浏览器（FF/IE/Chrome浏览器）......事的行为举止却像表.......

继承人为内联的CSS IM测试/分离的代码：

<style type="text/css"> 

body{ margin:0px; padding:0px;} 

.nospacedammit{ margin:0px; padding:0px;} 
#portS_mainW{ width:400px; height:500px; padding:0px; margin:0px;} 
#portS_mainW img{ margin:0px; padding:0px; } 
</style>

和继承人的基本的HTML此面板：

<div id="portS_mainW"> 
<span class="nospacedammit"><img src="images/xrodemo.jpg" alt="xro" width="400" height="300"/></span> 
<span class="nospacedammit"><img src="images/erase.png" alt="xro" width="400" height="200"/></span> 
</div>

增加了高度，以确保#s 100％的可靠性，ive增加了边距/填充以便将每个元素都归零，以再次确保没有间距。

我也将每个图像包裹在span标记中，然后将所有的一切都添加到零样式....尝试以任何方式强制零间距。仍然没有。

任何想法，我很高兴欣赏的见解。

预先感谢您。

来源

2011-09-26 somdow

BTW，什么字体是顶级图像中的文本......这很好 – SneakAttaack

您可以在nospacedammit类中设置line-height: 0;。这是将空间插入到两张图像之间的原因。

编辑：您需要将显示器设置为display: block以及

来源

2011-09-26 15:17:51 dDejan

yyou得到它。谢谢 – somdow

尝试将float:left添加到您的图片。刚刚在Firefox 3.6中测试过它，它适用于我:-)

我不是100％确定为什么会发生这种情况，但我的猜测是因为你的元素没有任何定位适用于它们，浏览器来决定。

来源

2011-09-26 15:12:08 SneakAttaack

尝试这种情况：

<img class="nospacedammit" src="images/xrodemo.jpg" alt="xro" width="400" height="300"/> 
<img class="nospacedammit" src="images/erase.png" alt="xro" width="400" height="200"/>

并添加显示的属性：块; .nospacedammit

来源

2011-09-26 15:17:02 rmlumley

CSS间距问题。需要新鲜的眼睛（应该很容易）

回答

相关问题