私のウェブページ内のリストの最初の2行divは大丈夫です。幅は4列です。 3行目の最初の2行の後、左端の3列はありませんが、右端の列のリスト要素はあります。次の行は完全に問題なく、5行目で問題が繰り返されます。下の図は、*がリスト要素を表します
* * * *
* * * *
*
* * * *
*
同様の問題を検索しましたが、見つかりませんでした一致するものは何でも、それが私のcss .liにあるに違いないと確信していますが、私はそれを理解できないようです。また、コードは、probelmsがある領域に関連するスニペットのみです。コード全体（279行htmlおよび398行css）が必要な場合はお知らせください。
前もって感謝します
CSS：
.gallery {
list-style: none;
margin: 0;
padding: 0;
}
.gallery li {
width: 260px;
float: left;
padding:17px;
position: relative;
}
.gallery h3 {
position: absolute;
top: 190px;
background: url(images/linkbg.jpg) repeat-x top left;
padding: 5px;
opacity: 0.85;
width: 250px;
text-align: center;
border-radius: 0 0 10px 10px;
}
.gallery img {
border-radius: 10px;
}
.poptrox-popup {
background: #111111;
border-radius: 8px;
padding: 20px 20px 60px 20px;
color: #aaaaaa;
}
.poptrox-popup .closer {
position: absolute;
width: 80px;
height: 30px;
bottom: 15px;
right: 20px;
background: url(images/linkbg.jpg) repeat-x top left;
color: #ffffff;
text-align: center;
text-decoration: none;
outline: 0;
border-radius: 8px;
line-height: 30px;
text-shadow: 0 1px 1px #003A6C;
}
.poptrox-popup .closer:hover {
background: #2094E6;
}
.poptrox-popup .caption {
position: absolute;
bottom: 0;
left: 0;
height: 60px;
line-height: 60px;
padding: 0 20px 0 20px;
}
html：
<div id="main">
<ul class="gallery">
<li>
<h3>Cisco 3560 Front</h3>
<a href="images/cisco3560.jpg"><img class="top" src="/images/images/cisco3560.jpg" width="260" height="200" title="Cisco 3560 Front View" alt="" /></a>
<p>Cisco Catalyst 3560 Front View</p>
</li>
<li>
<h3>Cisco 3560 Rear</h3>
<a href="images/cisco3560rear.jpg"><img class="top" src="/images/images/cisco3560rear.jpg" width="260" height="200" title="Cisco 3560 Rear View" alt="" /></a>
<p>Cisco 3560 Rear View</p>
</li>
<li>
<h3>Cisco 2970</h3>
<a href="images/cisco2970.jpg"><img class="top" src="/images/images/cisco2970.jpg" width="260" height="200" title="Cisco 2970" alt="" /></a>
<p>Cisco 2970 Front View</p>
</li>
<li>
<h3>Cisco 3640 (NMA)</h3>
<a href="images/cisco3640.jpg"><img class="top" src="/images/images/cisco3640.jpg" width="260" height="200" title="OOB/NMA" alt="" /></a>
<p>Cisco 3640 Front view. Commonly known in our network as an nma</p>
</li>
<li>
<h3>Cisco 2621 (NM1)</h3>
<a href="images/cisco2621.jpg"><img class="top" src="/images/images/cisco2621.jpg" width="260" height="200" title="Cisco 2621 Front View" alt="" /></a>
<p>Cisco 2621 Front view. Commonly known in our network as an nm1</p>
</li>
<li>
<h3>Cisco 2621 Rear</h3>
<a href="images/cisco2621rear.jpg"><img class="top" src="/images/images/cisco2621rear.jpg" width="260" height="200" title="Cisco 2621 Rear View" alt="" /></a>
<p>Cisco 2621 Rear view. The expansion ports would normally have modem cards installed in our network. This known by Mediacom as an nm1</p>
</li>
<li>
<h3>Cisco 7600</h3>
<a href="images/cisco7600.jpg"><img class="top" src="/images/images/cisco7600.jpg" width="260" height="200" title="Cisco 7600 Front View" alt="" /></a>
<p>Cisco 7600 Router Front view. The only one in the network currently is ar01.ent.demia</p>
</li>
<li>
<h3>Cisco 7606</h3>
<a href="images/cisco7606.jpg"><img class="top" src="/images/images/cisco7606.jpg" width="260" height="200" title="Cisco 7606 Front View" alt="" /></a>
<p>The Cisco 7606 is a smaller version of the 7609 vtn switch</p>
</li>
<li>
<h3>Cisco 7609</h3>
<a href="images/cisco7609.jpg"><img class="top" src="/images/images/cisco7609.jpg" width="260" height="200" title="Cisco 7609 Front View" alt="" /></a>
<p>Cisco 7609 Front view. More commonly known as a VTN Switch</p>
</li>
<li>
<h3>Cisco 1711 Front</h3>
<a href="images/cisco1711.jpg"><img class="top" src="/images/images/cisco1711.jpg" width="260" height="200" title="Cisco 1711 Front View" alt="" /></a>
<p>Cisco 1711 Router Front view.</p>
</li>
<li>
<h3>Cisco 1711 Rear</h3>
<a href="images/cisco1711rear.jpg"><img class="top" src="/images/images/cisco1711rear.jpg" width="260" height="200" title="Cisco 1711 Front View" alt="" /></a>
<p>Cisco 1711 Router Rear view.</p>
</li>
</ul>
</div>
回答：
回答№1は1根本的な原因 実際のデザインでは、フロートを使用しており、デザインに影響を与える高さを複数用意していないため、ブラウザの幅に可能な限り多くのLIがあります。
FIX 高さを追加：310px; .gallery liクラスへ。