Hey guys! So I’m working on a webpage:
https://codepen.io/goprime/pen/rJQdBW
I want the boxes(the content inside the second div) to be centered on the page, but I’m confused on how to do it, any help would be appreciated, thanks!
Hey guys! So I’m working on a webpage:
https://codepen.io/goprime/pen/rJQdBW
I want the boxes(the content inside the second div) to be centered on the page, but I’m confused on how to do it, any help would be appreciated, thanks!
Centered in a line or centered vertically?
Vertically, on the page
.inner{
height:100%;
background-color: palevioletred;
text-align: center;
padding: 2em;
}
.sound{
width: 100px;
height: 100px;
border: black solid 2px;
color: antiquewhite;
background-color: rgba(0, 0, 0, 0.288);
margin: 0 auto;
}
If you want to add a margin so the boxes are not directly on top of each other, change 0 to something else i.e. 5px
Note that I took out the flex display and justify from .inner (if you don’t remove this, the margin on .sound won’t do the job)
Thanks! is there a way to center the whole line of boxes on the center too?