これを適切に説明する方法がわかりませんが、ブロックをラップする要素のリストを取得しようとしています。
ここに私が意味するもののイメージがあります： 
コードは以下です。ブロックが 2 つしかない場合は左に正しくフロートしますが、さらに追加するとウェルカム ブロックの下に落ちます (画像のように)。
このデザインでは、ウェルカム ボックスの横に 2 つのブロックが表示され、その下に 3 つのブロックが表示されます。したがって、画像では、3 番目のブロックがウェルカム ブロックの下に配置され、後続のブロックは通常どおり続行されます (1 行あたり 3 ブロック)。
CSS
#welcome-block {
float: left;
width: 300px;
background: #fff;
}
#bingo-offers {
float: left;
margin: 0;
padding: 0;
overflow: hidden;
}
.bingo-offer {
float: left;
width: 300px;
background: #fff;
margin: 5px;
}
.bingo-offer ul {
margin: 0;
padding: 0;
}
HTML
<div>
<div id="welcome-block">
<h2>Welcome to Zesty Bingo</h2>
<p>Zesty Bingo is the home of FREE Bingo!</p>
<p>We have a huge selection of Bingo games to choose. Simple find a game, and click play. It’s as simple
as that.</p>
<p>Ensure you click the read more link on each game to find out more details and customer reviews on all
of our hosted games.</p>
<p>Good Luck and we wish you wealth and happiness from all the Zesty Bingo team.</p>
</div>
<ul id="bingo-offers">
<li class="bingo-offer">
<ul>
<li><img src="../img/winkbingo-146.png" alt=""></li>
<li><h3>Wink Bingo</h3></li>
<li>Free Cash: <span>£20</span></li>
<li>Join one of the biggest Bingo sites on the Internet and enjoy a whopping £20 bonus when you deposit £5!</li>
<li><a href="#">Play Now</a></li>
<li><a href="#">read more</a></li>
</ul>
</li>
<li class="bingo-offer">
<ul>
<li><img src="../img/winkbingo-146.png" alt=""></li>
<li><h3>Wink Bingo</h3></li>
<li>Free Cash: <span>£20</span></li>
<li>Join one of the biggest Bingo sites on the Internet and enjoy a whopping £20 bonus when you deposit £5!</li>
<li><a href="#">Play Now</a></li>
<li><a href="#">read more</a></li>
</ul>
</li>
<li class="bingo-offer">
<ul>
<li><img src="../img/winkbingo-146.png" alt=""></li>
<li><h3>Wink Bingo</h3></li>
<li>Free Cash: <span>£20</span></li>
<li>Join one of the biggest Bingo sites on the Internet and enjoy a whopping £20 bonus when you deposit £5!</li>
<li><a href="#">Play Now</a></li>
<li><a href="#">read more</a></li>
</ul>
</li>
<li class="bingo-offer">
<ul>
<li><img src="../img/winkbingo-146.png" alt=""></li>
<li><h3>Wink Bingo</h3></li>
<li>Free Cash: <span>£20</span></li>
<li>Join one of the biggest Bingo sites on the Internet and enjoy a whopping £20 bonus when you deposit £5!</li>
<li><a href="#">Play Now</a></li>
<li><a href="#">read more</a></li>
</ul>
</li>
<li class="bingo-offer">
<ul>
<li><img src="../img/winkbingo-146.png" alt=""></li>
<li><h3>Wink Bingo</h3></li>
<li>Free Cash: <span>£20</span></li>
<li>Join one of the biggest Bingo sites on the Internet and enjoy a whopping £20 bonus when you deposit £5!</li>
<li><a href="#">Play Now</a></li>
<li><a href="#">read more</a></li>
</ul>
</li>
<li class="bingo-offer">
<ul>
<li><img src="../img/winkbingo-146.png" alt=""></li>
<li><h3>Wink Bingo</h3></li>
<li>Free Cash: <span>£20</span></li>
<li>Join one of the biggest Bingo sites on the Internet and enjoy a whopping £20 bonus when you deposit £5!</li>
<li><a href="#">Play Now</a></li>
<li><a href="#">read more</a></li>
</ul>
</li>
<li class="bingo-offer">
<ul>
<li><img src="../img/winkbingo-146.png" alt=""></li>
<li><h3>Wink Bingo</h3></li>
<li>Free Cash: <span>£20</span></li>
<li>Join one of the biggest Bingo sites on the Internet and enjoy a whopping £20 bonus when you deposit £5!</li>
<li><a href="#">Play Now</a></li>
<li><a href="#">read more</a></li>
</ul>
</li>
</ul>
</div>