Centralizar colunas Bootstrap
24/09/2019
0
Fala galera! Para aproveitar meu primeiro post aqui no DevMedia resolvi perguntar um problema que tive hoje, com certeza deve ser algo super simples e fácil de corrigir com o Javascript, mas a minha dúvida mesmo é qual o melhor jeito de ser feito no próprio Bootstrap.
Enfim, tenho um esquema de slides que cada página dele está dividido desta maneira:
https://imgur.com/ZlZifKn
Mas dependendo da quantidade de tópicos dentro de uma página do slide, ele fica com 2 ou 1, assim:
https://imgur.com/EtLaN0B
Minha dúvida é a melhor maneira de fazer com que, quando tenho menos de 3 tópicos em um slide, eles aproveitem este espaço vazio nas colunas do bootstrap para centralizar os tópicos presentes, ficando assim quando tiver 2:
https://imgur.com/e7jkbld
e assim quando tiver 1:
https://imgur.com/cH3htML
Provavelmente deve ter alguma classe do Bootstrap que resolva esse problema, se tiver por favor me digam ( col-centered não resolveu, talvez esteja usando errado, e colocar text-align: center; no CSS do row não resolveu também haha)
Desde já agradeço!
Enfim, tenho um esquema de slides que cada página dele está dividido desta maneira:
https://imgur.com/ZlZifKn
Mas dependendo da quantidade de tópicos dentro de uma página do slide, ele fica com 2 ou 1, assim:
https://imgur.com/EtLaN0B
Minha dúvida é a melhor maneira de fazer com que, quando tenho menos de 3 tópicos em um slide, eles aproveitem este espaço vazio nas colunas do bootstrap para centralizar os tópicos presentes, ficando assim quando tiver 2:
https://imgur.com/e7jkbld
e assim quando tiver 1:
https://imgur.com/cH3htML
Provavelmente deve ter alguma classe do Bootstrap que resolva esse problema, se tiver por favor me digam ( col-centered não resolveu, talvez esteja usando errado, e colocar text-align: center; no CSS do row não resolveu também haha)
Desde já agradeço!
Daniel Brown
Curtir tópico
+ 0
Responder
Post mais votado
27/09/2019
Iaew cara, utilize flex-box para isso:
https://www.w3schools.com/css/css3_flexbox.asp#justify-content
https://www.w3schools.com/css/css3_flexbox.asp#justify-content
Bruno Pardim
Responder
Mais Posts
29/09/2019
Daniel Brown
Iaew cara, utilize flex-box para isso:
https://www.w3schools.com/css/css3_flexbox.asp#justify-content
https://www.w3schools.com/css/css3_flexbox.asp#justify-content
Eae mano, depois de dar uma cavacada essa foi a melhor solução que encontrei sim, obrigado!
Responder
Clique aqui para fazer login e interagir na Comunidade :)