CSS column flex

Community feedback

• 

  Fasuyi Miracle•60

  @iammiracle01Posted over 2 years ago

  Hi Muhammad, nice solution using CSS flex. By the way a better way for centering the page vertically is by including the following into your container styles:

  1. display:flex into
  2. set the flex-direction:column;
  3. then use the align-items:center to properly center your container on the page.

  You can also add margin: 5rem auto .

  Lastly, I'd suggest you remove the width and text-align property on your body tag.

  Hope this helps, happy coding.

  0
• 

  Ziyad ghobashi•180

  @ziy-egPosted over 2 years ago

  I love your code.

  about your question for centering any item: try this code: <code> position: absolute; top: 50%; left: 50%; </code> this code will put the left-top corner of the item on the page center, so to make it work on the whole item you have to add another code to it.

  <code> transform: translate(-50%, -50%); </code> that would move the left-top corner 50% up and left making the center point of the item in the center of the main container.. (makes it look like dealing with the center point)

  keep the good work..

  0

  ---

  

  Muhammad•90

  @code-AllahtosinPosted over 2 years ago

  @ziy-eg perfect, thanks!

  0