Centro de bootsrap 3 botão de barra de ferramentas dentro de div
-
20-12-2019 - |
Pergunta
Como centralizar horizontalmente de um bootstrap 3 btn-toolbar
botão dentro de um col-lg
div?
<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;
}
Eu quero que o botão de ser anexado ao topo do contêiner div, e também centralizada:
Solução
Aqui está o que eu fiz:
Quando um elemento posicionado absolutamente ele está flutuando acima do conteúdo.Nesse estado, ele só vai ocupar tanto espaço como o conteúdo dentro dela.
Se você definir a largura de 100% sobre o elemento que vai demorar até 100% do principal (ou relativa) de contêineres de largura.
.btn-toolbar.nested-top{
text-align:center;
position:absolute;
top:0;
width:100%;
}
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow