build out news website homepage using create-react-app

Hi Ha Kyo, how are you? I really liked the result of your project, but I have some tips that I think you will enjoy:

I noticed that you used a button in which case the best option would be an a, because in my head when a person clicks on a button written Read more, he is not confirming a form, or something like, it will be redirected to another page, to read more about!

To resolve do this:

<a type="button" class="read-more-btn btn btn-warning btn-lg ">READ MORE</a>

Every html document must contain a main tag, to inform what is the main content of the page, as this page is a complete page, that is, it has a header a main and the footer, wrap the main content with the main tag , for users who use screen readers, to be able to understand what the main content of the screen is!

The rest is great!

I hope it helps... 👍

Hi Kyo ! Hope you're fine. You're solution is almost close to the result it misses only few optimisations to fix the solution :

• Since i'm checking every solution about this challenge, display:grid is not a good way to develop this design, it is not enough specific to get the design properly, i advise you to prefer display: flex you'll be able to fix some widths and heights specific to each bloc and adjust some alignements;

• Usually, the designer and the customer worked hard to come to an agreement so, the closer we well be at the design the better. I advise you to use the chrome extension PerfectPixel to compare your development with a png/jpg file of your design. I always use this to be sure i'm ok with each breakpoints :)

• Concerning responsive breakpoints : Even if the mobile design is 375px, let your breakpoint reach max-width: 768px, to let the mobile design expend until you'll be able to display the desktop properly for landscape tablet

• Concerning the three columns section : you can put a fixed width to the image and align it to the top, it will look tidier ;)

Keep going this way, Hope it helps...

Maxime