Question

如何删除在website.com下面找到的空格div，就像730 px的空白一样。我一直在用我的css代码摆弄一个多小时了。我似乎无法隔离问题

HTML：

<div class="element">
<img src="imagesrc">
<div id="Projecttitle" class="Projecttitle">Title goes here</div>
<div id="Projectdescription" class="Projectdescription">Project description goes here</div>
</div>

<div class="element">
<img src="imagesrc">
<div id="Projecttitle" class="Projecttitle">Title goes here</div>
<div id="Projectdescription" class="Projectdescription">Project description goes here</div>
</div>

CSS：

div.element img:nth-of-type(1){
    padding-top:80px;
}
div.element div:not(:nth-of-type(1)){
    position:relative;
    width:auto;
    height:auto;
    bottom:375px;


}

div.element img{
    position:relative;
    right:198px;
    padding-right:56px;
    border:none;

}
.Projecttitle{
    text-transform:none;
color:#000;
text-align:left;
letter-spacing:.3px;
font:normal 22px QuaverSans;
margin-left:auto;
margin-right:auto;
overflow:visible;
z-index:0;
vertical-align:middle;
padding-top:15px;

}
#Projecttitle{
    position:relative;
    bottom:162px;
    width:410px;
    height:155px;
    left:226px;
}
.Projectdescription{
    text-transform:none;
color:#000;
text-align:left;
letter-spacing:.3px;
font:normal 17px QuaverSans;
margin-left:auto;
margin-right:auto;
overflow:visible;
z-index:0;
vertical-align:middle;


}
#Projectdescription{
    position:relative;
    bottom:290px;
    width:410px;
    height:155px;
    left:226px;
    z-index:0;
}

Answer 1

首先，您有一个未公开的div标记。第二个div.element嵌套在第一个{{1}}内，当它们显然应该是兄弟姐妹时。解决这个问题后，问题就会变得更加明显。您也使用太多相对定位。这会使问题更加混乱，因为屏幕上元素的外观会发生变化，但它在文档流中占据的空间却没有。

CSS白色间距问题

1 个答案: