display : flex; margin: 210px auto 210px auto;

Community feedback

• 

  David Bedford•180

  @djbedfordPosted about 2 years ago

  Hey, you said you had trouble centering the div vertically, you're on the right track using flexbox with justify content and align items but you must also remember to set the height. The reason for this is because a div just takes up as much space as the content inside of it does, so when trying to center it vertically it has no room to move, in order to align it vertically you can set the height to 100vh which will give it the room to center it. Ideally you would wrap the div within a main tag and add the flex box and height styles there, this should solve your issue with vertically centering. You can also remove the top and bottom margin as they will no longer be required.

  Apart from that good job!

  Marked as helpful

  3

  ---

  

  Axraxa•50

  @axraxaPosted about 2 years ago

  @djbedford Thx a lot for your helpful explanation <3

  0
• 

  Eugene•100

  @SleepySleepyFoxPosted about 2 years ago

  You might try to center a div with: position: absolute; transform: translate(50%, -50%); right: 50%; top: 50%;

  Marked as helpful

  0

  ---

  

  Axraxa•50

  @axraxaPosted about 2 years ago

  @SleepySleepyFox that's a nice way to solve it , but i started html and css 2weeks ago and didn't go that deep yet , have not checked transform element . thx for your time and information <3

  0