Question

我有一个设置为水平显示而不是垂直显示的列表。它也设置为全屏高度（不确定是否会有所不同）。该列表在Chrome和Safari中正确显示，但它只显示Firefox中的第一项。有时，如果我刷新，它将显示所有项目，但仅以垂直格式显示。我尝试过多次修复，似乎都没有。如果有人能对此有所了解，我们将不胜感激。

这是HTML：

<ul class="project">

<li class="item">
<div class="overlay">
<section class="img-info">
  <h1>Ro, 2012</h1>

</section>
</div>
<img src="01.jpg" />
</li>

<li class="item">
<div class="overlay">
<section class="img-info">
  <h1>Jonathan, 2012</h1>

</section>
</div>
<img src="02.jpg" />
</li>
</ul>

这是CSS：

article.projects {
    height:100%;
    float:none;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space:nowrap;
}

article.projects ul.project {
    height:100%;
    width:auto;
    display:inline-block;
    float:left;
    padding-left:72px;
}

article.projects ul.project li.item {
    height:100%;
    width:auto;
    min-width:300px;
    float:left;
    padding-bottom:0px;
    padding-right:1px;
}

该网站现场直播 - http://jennaegarrett.com/

该网站具有响应能力，因此如果您进入代码，相关的CSS将位于文件的底部。

Firefox水平列表滚动CSS

0 个答案: