MyClassName {
display: flex;
flex-direction: column;
align-items: center;
}
Centering multiple div sections as columns or vertically for mobile
CSS
.my_container {
display: flex;
flex-direction: column;
align-items: center; /*or flex-start for top aligned */
justify-content: center;
gap: 20px; /* spacing between items */
margin: 20px 0;
}
.my_section {
width: 100%;
max-width: 400px;
}
@media only screen and (max-width: 768px)
{
.my_container
{
flex-direction: row;
flex-wrap: wrap;
}
.create_proof_option_section
{
width: auto;
}
}
HTML
<div class="my_container">
<div class="my_section">
</div>
<div class="my_section">
</div>
<div class="my_section">
</div>
</div>
