A simple but frustrating Blog preview card

Community feedback

• 

  Adriano•42,780

  @AdrianoEscarabotePosted 4 months ago

  Hi dullarzee, how are you doing? I really loved the outcome of your project, but I have a few suggestions that I think might be helpful:

  Using Flexbox or Grid on the body to center elements ensures a more responsive and adaptive layout, fitting different screen sizes seamlessly. It avoids manual calculations and constant adjustments needed with margin, padding, or absolute positioning. These techniques provide more consistent alignment and simplify the code.

  flexbox:

  body {
      display: flex;
      justify-content: center;
      align-items:  center;
      min-height: 100vh;
  }
  

  grid:

  body {
      display: grid;
      place-content: center;
      min-height: 100vh;
  }
  

  The rest is excellent.

  I hope you find it useful. 👍

  0
• 

  Dylan Heslop•2,400

  @dylan-dot-cPosted 4 months ago

  Bro alot of things you are doing wrong here such as using absolute everywhere instead of making the content flow naturally. And if you used px or %s it still wont look good on all screen sizes

  Best thing to do is start over, structure ur html code better than go back to css, user grid/flex to center and use css properly to style your stuff.

  Feel free to check out my solution and others as well ask more questions if you would like.

  0