Wie kann eine ganze Reihe nach rechts verschoben werden?

Question

Ich versuche, eine Reihe von Spalten, die jeweils eine Schaltfläche enthalten, nach rechts zu verschieben, sodass sie in der Mitte der Seite positioniert wird.

<div> 
<div class="container-fluid" id="home"> 
    <h1>Welcome to Daniel's Portafolio</h1> 

<div class="row"> 
    <div class="col-md-2"> 
    <a href="https://www.linkedin.com/in/daniel-ramirez-b38203118"> 
    <button class="btn btn-default btn-social-icon btn-xl"><i class="fa fa-linkedin"></i> LinkedIn</button> 
    </a> 
    </div> 
    <div class="col-md-2"> 
    <a href="https://github.com/tadm123"> 
    <button class="btn btn-default btn-social-icon btn-xl"><i class="fa fa-github"></i> Github</button> 
    </a> 
    </div> 
    <div class="col-md-2"> 
    <a href="freecodecamp.com/tadm123"> 
    <button class="btn btn-default btn-social-icon btn-xl"><i class="fa fa-free-code-camp"></i> freeCodeCamp</button> 
    </a> 
    </div> 
    </div> 

Ich versuche, dies durch den Einsatz padding-left in CSS zu tun:

.row { 
    padding-left:300px; 
} 

Es Und sie bewegt sich, aber es ändert sich auch der Abstand zwischen den Tasten. Jede Hilfe wäre willkommen.

Answer 1

Sie verwenden ein Rasterlayout. Durch das Anwenden der linken Auffüllung werden die Spalten nicht zentriert. Es wird jedoch die Breite dieser Spalten weiter einschränken und ihnen eine eher ungerade Positionierung geben. Stattdessen müssen Sie einen Offset verwenden.

Sie haben insgesamt 12 Spalten (zumindest das ist der Standard in Bootstrap) und Sie verwenden 6 für Ihren Inhalt (3 x 2). Sie müssen die erste Spalte um 3 zur Mitte versetzen. Verwendung

<div class="row"> 
    <div class="col-md-2 col-md-offset-3">