Wie definiert man Spaltenabstand auf einem Bootstrap div?

Ich habe drei div-Elemente auf einer Seite deklariert und möchte das letzte div-Element neu positionieren, so dass es ein Zeichen näher an der zweiten div in derselben Zeile ist.Wie definiert man Spaltenabstand auf einem Bootstrap div?

Was habe ich versucht, ist die Bearbeitung der Spalte Werte am dritten div niedrigere Werte zu sein, was ich glaubte, die div näher an der zweiten div drücken würde:

class="col-xs-2 col-sm-2 col-md-1"

Aber das scheint nicht zu haben jede Auswirkung auf die Position der dritten Spalte.

Frage:

Wie kann ich neu zu positionieren das dritte div-Element in der 2. div zu bewegen näher "Kursnummer:"?

Ich versuchte auch, die col-Werte des 3. div zu erhöhen, der den Text auf eine neue Zeile setzt. Das ist nicht die erforderliche Positionierung ist:

class="col-xs-7 col-sm-7 col-md-6 nwrp"

Die drei div Kontrollen wie definiert, wie in meiner ASP-Seite folgt:

     <div class="row mrgn"> 
          <div class="col-xs-8 col-sm-8 col-md-5"><h5><strong>Course Name:</strong></h5></div> 
          <div class="col-xs-3 col-sm-3 col-md-2 nwrp"><h5><strong>Course Code:</strong></h5></div> 
          <div runat="server" id="OfferStatusTitle" class="col-xs-3 col-sm-3 col-md-2 nwrp"><h5><strong>Offer Status:</strong></h5></div> 
          <div class="col-xs-1 col-sm-1 col-md-3"></div> 
         </div>

Und das ist, was die drei Säulen derzeit wie folgt aussehen:

Quelle

2016-04-08 Brian J

Bootstrap dividiert eine Zeile durch 12. In Ihrem Fall überschreiten Sie die 12 Spalten auf sm/xs oder erreichen es nicht in mittleren Geräten. Wenn Sie den letzten Abschnitt näher machen möchten, dann machen Sie etwas wie 6 4 2. oder verwenden Sie dieses Online-Tool: http://www.layoutit.com/build – Zaki

Jede Spalte in Bootstrap haben 15px padding links und rechts. Sie können das entfernen, um Inhalte auf der linken Seite näher zu sehen. Und Sie können nicht mehr als 12 Spalte in derselben Zeile haben.

Und wenn Sie möchten, können Sie präzisieren neue Div innerhalb zweiten Div hinzufügen und in diesem Div haben Sie 12 Spalten, so dass Sie genauer angeben können.

<div class="col-xs-8 col-sm-8 col-md-5"><h5><strong>Course Name:</strong></h5></div> 
<div class="col-xs-3 col-sm-3 col-md-2 "> 
    <div class='row'> 
      <div class='col-xs-6 nwrp'> 
       <h5><strong>Course Code:</strong></h5> 
      </div> 
      <div runat="server" id="OfferStatusTitle" class="col-xs-6 nwrp"><h5><strong>Offer Status:</strong></h5> 
      </div> 
    </div> 
</div> 
<div class="col-xs-1 col-sm-1 col-md-3"></div>

Es ist wahr, dass Sie 12 Spalte in einer Zeile haben kann, aber innerhalb jedes div-Tag können Sie weitere 12 Spalten haben. Und verwenden Sie row class für die erste innere Klasse, sonst gibt es 30px Padding links und rechts für das erste bzw. letzte div-Tag.

Zeile hat -15px Rand links und rechts.

Quelle

2016-04-08 13:30:17 Anand

Eigentlich müssen Sie die dritte Spaltenbreite erhöhen bedeutet die Spaltenwerte wie folgt teilen:

<div class="row"> 
<div class="col-md-12 "> 
    <div class="col-md-3">Course Name:</div> 
    <div class="col-md-2">Course Code:</div> 
    <div class="col-md-7">Offer Status:</div></div> 
</div>

Refer this link you can find more option.

Quelle

2016-04-08 12:33:53

Rememer um die inneren Spalten in einer anderen 'Zeile' zu wickeln – ZimSystem

Ich bearbeitet meine Frage oben, da ist ein viertes div. Wie kann ich die gleiche Bearbeitung vornehmen? –

Wie definiert man Spaltenabstand auf einem Bootstrap div?

Antwort

Verwandte Themen