Nadun Dhananjaya• 210
@nadun-dhananjaya
Posted
Hello 👋. Congratulations on successfully completing the challenge! 🎉
I have other recommendations regarding your code that I believe will greatly interest you
HTML and CSS
- In this challenge Blog card is the main content of the page. Therefore, adding a <main> tag around the container is a good practice.
<html lang="en">
<head>
<-- Your head content here -->
</head>
<body>
<-- main -->
<main>
<-- container -->
<div class="container">
<-- Card content here -->
</div>
</main>
</body>
</html>
- The Blog card is not in the middle of the screen. You can centralize your blog card by centralizing the items inside the main tag.
You can centering the card on the screen using display: gird:
main {
display: grid;
place-items: center;
min-height: 100vh;
}
or
using display: flex as below
main {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
}
0
