Bom tenho aqui os botões personalidades com CSS. Preciso que eles sempre fiquem no centro da pagina, se eu colocar vários botões eles tem que ficar em um fila no centro da página. E quando a tela for pequena eles vão criando uma quebra de linha.
Alguém sabe como fazer isso sem ter que colocar os botões dentro de uma tag?
.text-white,
.text-white-houve:hover,
.bt {
color: #FFFFFF !important;
}
.shadow-1,
.bt,
.container {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}
.shadow-2,
.bt:hover,
.context_menu_pai,
.box_login,
.datepicker.dropdown-menu,
.dialogbox,
.overflow-menu ul {
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
.transition-1,
.bt {
transition: all .3s ease-out;
transition-property: all;
transition-duration: 0.3s;
transition-timing-function: ease-out;
}
.bt {
border: 0;
padding: 10px;
width: 200px;
height: 50px;
display: inline-block;
margin: 10px;
cursor: pointer;
border-radius: 4px;
}
<button class='bt' type='submit'>OK</button>
<button class='bt' type='submit'>OK</button>
<button class='bt' type='submit'>OK</button>
<button class='bt' type='submit'>OK</button>
<body>
?