Responsive page using CSS flexbox

Community feedback

• 

  Rahexx•210

  @RahexxPosted 3 days ago

  If you’re having issues with margins, try setting the following on the body:

  display: flex;
  justify-content: center;
  align-items: center;
  

  or different approach for .container:

  .container{
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
  }
  

  As you can see, using the flex option on the body tag results in less code. Let me know if this helps! If you still have any issues, feel free to reach out, and I'll do my best to assist.

  0

  ---

  

  chukwuma jennifer•20

  @jhenniiferPosted 2 days ago

  @Rahexx hello, i am really sorry for the late response. i really appreciate your response, i will try it and get back to you immediately.

  0

  

  chukwuma jennifer•20

  @jhenniiferPosted 2 days ago

  @Rahexx the second option worked for me, i don't know about the transform property. i will research on it and learn more. Thank you again, i will reach other when i am confused again.

  1

  

  Rahexx•210

  @RahexxPosted 1 day ago

  @jhenniifer No problem with the late response; it took me 17 hours to check your message, so it's okay. I'm glad to hear that it helped you! With transform, you can create animations, and it offers many options, so this knowledge will be useful for you in the future.

  Marked as helpful

  0

  

  chukwuma jennifer•20

  @jhenniiferPosted 1 day ago

  @Rahexx thank you.

  0