显示none占用空间

Display none takes up space

本文关键字:占用空间 none 显示      更新时间:2023-09-26

我的分页导航显示:none有一些问题。当我检查inspect元素时,它不占用空间,但由于某种原因,在分页导航所在的地方,有一个不应该在那里的空白空间。

我试过添加溢出:隐藏,可见性:无,高度:0,但没有一个它的工作。

可能和位置的相对和绝对有关,我还不太明白。

themeexp1.tumblr.com

编辑:这不是14px的边距,这是更大的边距空格:http://postimg.org/image/hiixhonoh/ HTML

<div id="content">
 <div class="container" id="{postID}">
  <div class="container-overlay"></div>
  <div class="photo inner">
    <a href="{permalink}">
      <img src="{block:indexpage}{PhotoURL-500}{/block:indexpage}{block:permalinkpage}{PhotoURL-HighRes}{/block:permalinkpage}" alt="{PhotoAlt}">
    </a>
  </div>
</div>
<nav id="pagination">
  <ul>
    {block:PreviousPage}<li><a href="{PreviousPage}">Previous page</a></li>{/block:PreviousPage}
    {block:NextPage}<li><a id="nextPage" href="{NextPage}">Next page</a></li>{/block:NextPage}
  </ul>
</nav>
</div>
CSS

#content{
margin: 0 auto;
position: relative;
}
.container{
margin-bottom: 14px;
}
.container-overlay{
width: 100%;
height: 100%;          
opacity: 0;
position:absolute;
}
.icons{
opacity: 0;
position: absolute;
left: 50%;
top: 50%;
width: 100%;
text-align: center;
}
#pagination{
display: none;
position: absolute; 
}

如果没有演示,很难告诉您想要什么,但是底部有空间,因为您的.containerdiv有margin-bottom: 14px;

例子小提琴