Can anyone tell me which property i can use to move this blue box to the center? here is the link to the project https://codepen.io/emilynyaruri/pen/pooQgwa
I want the blue box to decrease in size so that the background picture can also be seen
you can set the width of your blue box in the CSS
#survey-form{
background:#437F97;
color: white;
font-family: halvetica;
font-size:20px;
padding: 60px 0px 60px 30px;
border-radius: 25px;
box-shadow: 3px 5px 23px 0px rgba(0,0,0,0.75)
margin: 0px 10px 0px 10px;
width: 50%;
margin: 0 auto;
}
I added the width to make it 50%
And the margin: 0 auto;
Which sets the top and bottom margin to 0 and puts an equal margin on the sides.
Give margin: 0 auto;
a google to find out how it centers elements
2 Likes