Flex and Flex items

Hello Yusuf!

Your solution looks great!

I have a couple of suggestions for improvement:

• In order to make your HTML code more semantic, wrap the main title with <h1> instead of just a. You can even wrap the title with h1 inside the tag. It's always a good practice to use HTML headings for titles. Here's a quick guide on how to use them:

The <h1> to <h6> tags are used to define HTML headings. <h1> defines the most important heading. <h6> defines the least important heading. Only use one <h1> per page - this should represent the main heading/subject for the whole page. Also, do not skip heading levels - start with <h1>, then use <h2>, and so on.

• Also, still about semantic HTML, replace your div.container with main.container.

All these tag changes may have little or no visual impact but they make your HTML code more semantic and improve SEO optimization as well as the accessibility of your project.

I hope it helps!

Other than that, great job!

Hello👋 Yusuf, nice solution I only have some few suggestions you might need.

1 Every html document should have a main tag that encloses the main page contents change <div class="container"> To <main class="card"> This will change nothing visually but it makes all the difference. You can learn more about the main tag in this article Another article you might find useful is Semantic html..

2 For accessibility reasons change <p>Published 21 Dec 2023</p> to <p>Published <time datetime="21-12-2023">21 Dec 2023</time></p> The code above is machine readable and therefore it improves user experience for people using assistive technology such as screen readers.

I hope this helps, happy coding 🙃