Centro Bootstrap 3 Tasto Toolbar all'interno di div
-
20-12-2019 - |
Domanda
Come centrare orizzontalmente un pulsante Bootstrap 3 btn-toolbar
all'interno di un div col-lg
?
<div class="col-lg-6 col-sm-3 noleftpad">
<div class="well topnestedbut">
<div class="btn-toolbar nested-top">
<button type="button" class="btn btn-default btn-sm"><strong>This must be centered</strong></button>
</div>
</div>
</div>
.
CSS:
.btn-toolbar.nested-top{
position:absolute;
top:0px;
text-align:center;
}
.well.topnestedbut{
padding:35px 10px 10px;
}
.noleftpad{
padding-left:0px;
}
.
Voglio che il pulsante sia attaccato alla parte superiore del div del contenitore e anche centrato:
Soluzione
Ecco cosa ho fatto:
Quando un elemento è posizionato assoluto è fluttuante sopra il contenuto.In questo stato occuperà solo la stanza come il contenuto all'interno di esso.
Se si imposta la larghezza del 100% su quell'elemento, occupererà il 100% della larghezza dei contenitori genitore (o relativa).
.btn-toolbar.nested-top{
text-align:center;
position:absolute;
top:0;
width:100%;
}
. Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow