Legen Sie die divs nebeneinander

Wie der folgende Code ändern:Legen Sie die divs nebeneinander

<div class="col-lg-8" ng-repeat="contact in [{name:'Jim'},{name:'Joe'},{name:'Dan'}]"> 
     <div class="col-lg-3"> 
      <div>{{contact.name}}</div> 
     </div>  
    </div>

zu die Namen miteinander nächsten bekommen und nicht vertikal, wie es jetzt der Fall ist?

Quelle

2017-02-17 Unknown developer

'div' ist ein Blockelement. Blockelemente werden spaltenweise ausgerichtet. Die nächste (n) Frage (n) lautet: Wollen Sie wirklich ein Blockelement oder möchten Sie flexbox dafür verwenden? – Makoto

'float: left' ist dein Freund –

Eigentlich habe ich anstelle von Namen divs, die einige Informationen über jeden Kunden enthalten. Ich möchte so viele wie möglich in einer LG-8-Größe und gleichzeitig diese verantwortlich zu sein –

Beachten Sie, dass Ihr aktueller HTML-Code <div class="col-lg-8"> dreimal wiederholt wird. Wahrscheinlich wollen Sie es zu folgenden Änderungen:

<div class="col-lg-9"> 
    <div class="row"> 
     <div class="col-lg-4" ng-repeat="contact in [{name:'Jim'},{name:'Joe'},{name:'Dan'}]"> 
      <div>{{contact.name}}</div> 
     </div> 
    </div> 
</div>

Diese <div class="col-lg-4"> drei produzieren fit in <div class="col-lg-9"> zu sein.

Quelle

2017-02-17 17:48:36 Pejman

Das wäre immer noch falsch Bootstrap-Code. Ein .col-xxx muss in einem .row sein. Ansonsten sind der Abstand und die Ränder falsch. –

Natürlich. Ich nehme an, OP hat ein Wrapper-Element mit 'class =" row "' vor diesem Code. – Pejman

Ihre Antwort legt ein .col-lg-3 direkt in ein .col-lg-9, so dass es die Bootstrap-Regeln nicht respektiert. Warum sollten das OP und alle anderen Leser annehmen, dass ein .row-Code zu dem Code in Ihrer Antwort hinzugefügt werden sollte? Warum nicht den Code reparieren? –

Legen Sie die divs nebeneinander

Antwort

Verwandte Themen