Twitter Bootstrap - wie man Elemente horizontal oder vertikal zentriert

Gibt es eine Möglichkeit, Html-Elemente vertikal oder horizontal innerhalb der Haupt-Eltern zu zentrieren?

itsme
Bearbeitete Frage 8. Mai 2013 в 5:16
Programmierung
css twitter-bootstrap
10. April 2012 в 12:21
15 Aufrufe
Lösung

Aktualisierung: Diese Antwort war zwar Anfang 2013 wahrscheinlich richtig, sollte aber nicht mehr verwendet werden. Die richtige Lösung [verwendet Offsets] (https://stackoverflow.com/a/40002430/1729885).

Als Anregung für andere Benutzer gibt es auch native Bootstrap-Klassen wie:

class="text-center"
class="pagination-centered"

Dank an @Henning und @trejder

Community
Bearbeitete Antwort 23. Mai 2017 в 12:10
Kommentare (6)

Ich benutze dies


    html, body {
        height: 100%;
        margin: 0;
        padding: 0 0;
    }

    .container-fluid {
        height: 100%;
        display: table;
        width: 100%;
        padding-right: 0;
        padding-left: 0;
    }

    .row-fluid {
        height: 100%;
        display: table-cell;
        vertical-align: middle;
        width: 100%;
    }

    .centering {
        float: none;
        margin: 0 auto;
    }


    <div class="container-fluid">
        <div class="row-fluid">
            <div class="offset3 span6 centering">
                content here
            </div>
        </div>
    </div>
Ian Campbell
Bearbeitete Antwort 3. Januar 2014 в 12:38
Kommentare (1)

für die horizontale Zentrierung können Sie etwas wie dieses haben:

.centering{
float:none;
margin:0 auto
}

 <div class="span8 centering"></div>
Jsalinas
Bearbeitete Antwort 25. Juli 2014 в 2:22
Kommentare (3)