获取溢出：隐藏行为本身

Question

我想实现一个简单的图像轮播，我不能让图像下降到下一行。这里是我的CSS：

#gallery-wrap{margin: 0 auto; overflow: hidden; width: 532px; position: relative; float: left;} 
#gallery{position: relative; left: 0; top: 0; float: left;} 
#gallery li{float: left; margin: 0 20px 15px 0;} 
#gallery li a img{border: 4px solid #40331b; height: 175px; width: 60px; float: left;} 

#gallery-controls{margin: 0 auto; width: 732px; float: left;} 
#gallery-prev{float: left;} 
#gallery-next{float: right;} 

这里是我的HTML：

<div id="gallery-wrap"> 

       <ul id="gallery"> 

       </ul> 
      </div> 
      <div id="gallery-controls"> 
       <a href="#" id="gallery-prev"><img src="prev.png" alt="" /></a><a href="#" id="gallery-next"><img src="next.png" alt="" /></a> 
      </div> 

我试图同时显示5张，其余的隐藏。然后点击prev和next按钮，使用jQuery来回滚动。现在，当图片超过5张时，开始下降到下一行，而不是隐藏起来。

Answer 1

嗯，是的。如果您在#gallery-wrap上指定height值，它将隐藏超出该高度的子元素。如果你不（而你没有），那么#gallery-wrap将会像其孩子所需要的一样高。

在#gallery-wrap上设置一个height，你很好走。