Displaying Row Of Divs Vertically Issue
I'm having a slight issue with getting my three div boxes to display vertically while in mobile view. When in desktop/tablet view I would like them to remain as three divs in the o
Solution 1:
Use flexbox, you can set the container to display flex-direction: column
while on mobile and flex-direction: row
while on desktop or tablet.
Solution 2:
No need for display block as you already using flex box just give the container on mobile view flex-direction: column;
Solution 3:
You can achieve this easily with display: grid
.container {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
justify-content: center;
}
then in your media query change the template to:
.container{
grid-template-columns: 1fr;
}
Post a Comment for "Displaying Row Of Divs Vertically Issue"