0
我需要一些幫助或建議。我一直在爲我的僱主創建一個非常基本的招聘門戶網站。然而，看起來我並沒有正確設置腳手架，因爲當從一個較小的設備上看這些柱子時，它們似乎非常「壓扁」在一起。 什麼令我困惑的事實是，我已經使用了xs列，我認爲這會考慮更小的設備，因此會相應地調整列的寬度...引導柱壓扁
我真的很感激如果有人能告訴我我做錯了什麼，或者告訴我如何解決它以使其更具響應性。
這裏是一個pen to a working example及以下列（無標頭）：
<div class="row buffer-top">
<div class="col-xs-2 col-xs-offset-1 text-center">
<div class="thumbnail">
<span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x icon-siteAccess"></i><i class="fa fa-circle-thin fa-stack-2x"></i><i class="fa fa-clipboard fa-stack-1x"></i></span>
<div class="caption">
<h3>Site Access Controllers</h3>
<p><strong>Location:</strong> UK-wide</p>
<p><a href="portals/0/resources/pdf/placeholder.pdf" target="blank" class="btn btn-default" role="button">More info</a><a href="mailto:[email protected]" target="_blank"class="btn btn-default" role="button">Apply</a></p>
</div>
</div>
</div>
<div class="col-xs-2 col-xs-offset-1 text-center">
<div class="thumbnail">
<span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x icon-developers"></i><i class="fa fa-circle-thin fa-stack-2x"></i><i class="fa fa-code fa-stack-1x"></i></span>
<div class="caption">
<h3>Software Developers</h3>
<p><strong>Location:</strong> Tunbridge Wells</p>
<p><a href="portals/0/resources/pdf/softwarePlaceholder.pdf" target="blank" class="btn btn-default" role="button">More info</a><a href="mailto:[email protected]" target="_blank" class="btn btn-default" role="button">Apply</a></p>
</div>
</div>
</div>
<div class="col-xs-2 col-xs-offset-1 text-center">
<div class="thumbnail">
<span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x icon-office"></i><i class="fa fa-circle-thin fa-stack-2x"></i><i class="fa fa-building-o fa-stack-1x"></i></span>
<div class="caption">
<h3>Site Access Manager</h3>
<p><strong>Location:</strong> UK-wide</p>
<p><a href="portals/0/resources/pdf/hOfficePlaceholder.pdf" target="blank" class="btn btn-default" role="button">More info</a><a href="mailto:[email protected]" target="_blank" class="btn btn-default" role="button">Apply</a></p>
</div>
</div>
</div>
<div class="col-xs-2 col-xs-offset-1 text-center">
<div class="thumbnail">
<span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x icon-consultant"></i><i class="fa fa-circle-thin fa-stack-2x"></i><i class="fa fa-question fa-stack-1x"></i></span>
<div class="caption">
<h3>Site Consultants</h3>
<p><strong>Location:</strong> UK-Wide</p>
<p><a href="portals/0/resources/pdf/consultantPlaceholder.pdf" target="blank" class="btn btn-default" role="button">More info</a><a href="mailto:[email protected]" target="_blank" class="btn btn-default" role="button">Apply</a></p>
</div>
</div>
</div>
</div>
什麼是你期待發生什麼？圓圈應該變小嗎？他們應該分成多行嗎？ –
圓圈大小可能會持續（因爲寬度是靜態的），但偏移量應該更好地格式化。 – geostocker