News Homepage Main - Grid and Flexbox

Community feedback

• 

  T

  ApplePieGiraffe•30,545

  @ApplePieGiraffePosted almost 2 years ago

  Hello, Shraddha Vkarma! 👋

  Nice effort on this challenge! 👏

  A few things I'd like to suggest are,

  • Using padding to ensure that there is always a bit of space between the content of the page and the edges of the screen (as that space disappears when the width of the screen decreases in the desktop layout).
  • Making the "Read more" element a link (not a button), since it will likely navigate the user to another page when clicked.
  • I think you will have an easier time creating the layout for this page and making it responsive if you divide the page into smaller sections and create the layout for those first before assembling those sections into a larger layout. I see that you have done this somewhat, but I think you can further group the main image and the text content beneath it, and then use CSS grid to assemble the three main sections of the page. 😉 Take care to ensure that the layout doesn't appear broken and sections don't overlap when the width of the screen decreases. 🙂

  Hope you find this helpful. 😊

  Keep coding (and happy coding, too)! 😁

  Marked as helpful

  2

  ---

  

  Shraddha Vkarma•40

  @Shraddha-V22Posted almost 2 years ago

  @ApplePieGiraffe Thank you so much!😊 I made the changes you suggested! Happy coding!😄😄

  1