Boostrap erstellt keine 4 Spalten

Question

Dies ist wahrscheinlich eine einfache, aber ich bin neu Bootstrap und sind nicht ganz vertraut mit, wie es funktioniert. Ich habe den folgenden Code, um 4 Spalten mit gerader Breite in einer Zeile zu erstellen. Aber es erscheint weiterhin als 4 vertikal gestapelte Spalten auf meinem Laptop (1920x1080) und ich bin mir nicht ganz sicher, wo ich es falsch mache.

<div class="container"> 
      <div class="row-fluid"> 
       <div class="col-md-3"><!--about us feature 1st --> 
        <div class="about-block"> 
         <div class="heading"> 
          <h6>AVAILABILITY</h6> 
          <p>Fast Response Time<br> 15 Minutes Setup</p> 
         </div> 
        </div> 
       </div><!--about us feature 1st closed --> 
       <div class="col-md-3"><!--about us feature 2nd --> 
        <div class="about-block"> 
         <div class="heading"> 
          <h6>SPEED</h6> 
          <p>Average 7x Faster<br> Complete Data Coverage</p> 
         </div> 
        </div> 
       </div> <!--about us feature 2nd closed --> 
       <div class="col-md-3"><!--about us feature 3rd --> 
        <div class="about-block"> 
         <div class="heading"> 
          <h6>SAFETY</h6> 
          <p>Reduce Human Risk<br> No Scaffolding</p> 
         </div> 
        </div> 
       </div><!--about us feature 3rd closed --> 
       <div class="col-md-3"><!--about us feature 4th --> 
        <div class="about-block"> 
         <div class="heading"> 
          <h6>COST SAVINGS</h6> 
          <p>Targeted Repairs<br> Less Outage Time</p> 
         </div> 
        </div> 
       </div><!--about us feature 4th closed --> 
      </div> 
     </div> 

UPDATE hinzugefügt Screenshot:

Answer 1

Verwenden col-sm-3 stattdessen oder machen Sie Ihre <div> Element breiter. Wenn Sie einen Behälter direkt im Körper verwenden, sollten Sie kein Problem haben. Wenn Sie ein anderes Element verwenden, stellen Sie sicher, dass es breit genug ist.

Answer 2

Versuchen Sie zunächst, die Klasse row-fluid in style="float: left" zu ändern. Zweitens ist es richtig, dass (theoretisch) der Bildschirm in 12 unterteilt ist, aber 3 * 4 möglicherweise mehr als 12 (Rand, Rand usw.) ist. Wenn der erste Teil drei Spalten und der vierte darunter rendert, versuchen Sie, die Größe der Spalten zu reduzieren, indem Sie beispielsweise width = 24% einstellen.