1

如何删除在 website.com 上找到的元素 div 下方的空白就像 730 像素的空白。一个多小时以来,我一直在摆弄我的 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;
}
4

1 回答 1

1

首先,您有一个未关闭的div标签。当他们显然应该是兄弟姐妹时,第二个div.element嵌套在第一个内部。当您解决此问题时,问题将变得更加明显。你也使用了太多的相对定位。这使问题更加混乱,因为屏幕上元素的外观发生了变化,但它在文档流中“占用”的空间没有变化。

于 2012-11-24T02:36:03.480 回答