I'm happy with how it came out, I made sure to make it look good on diffrent screen sizes
What specific areas of your project would you like help with?If ther's a way to optimize the code please feel free to share!
The code is easy to read and follow. Layout is consistent across multiple screen sizes, overall a good job.
I still have quite a bit of looking things up on some basic syntax, but that will come with time.
Hey there! You have some redundant css styles that can be cut out. You only display flex for one area, which is the author info div. Setting the container class and div to flex with a flex-direction of column is the same as just leaving the default display to block. So you could condense lines 11-21 to just being .authorInfo {display: flex}. You can adjust the margins for your meta and tag classes to achieve the "spacing" needed.
I am proud of starting to actually putting my skills into practice , and finally achieving the goal while learning about my strengths and areas i lack practice in, perhaps next time i should deepen my knowledge regarding the css flex box as it seems a very important concept in css.
What challenges did you encounter, and how did you overcome them?this project was a bit simple actually , how ever i had to learn more about git and github which turned out pretty useful and simple once you understand them.
What specific areas of your project would you like help with?for the meantime , none.
Hello, Overall everything looks good, the only gripe I have is the use of paragraph tags and id's. If you wanted to reuse this card's styling without needing to "hard-code" each id, you could set the first p tag as a heading tag. Styling the tags keeps the sites styles consistent, for accents pieces you can add utilize the tag's id property.
<section class="card-body">
<h3> Improve your front-end skills by building projects</p>
<p> Scan the QR code to visit Frontend Mentor and take your coding skills to the next level
</p>
</section>
h3{
font-size: 1.4rem;
font-weight: bold;
}
p{
color: gray;
}