Assessment wanted for Fundamental CSS Comprehension project

Need an assessment for my code.

code pen link
Assessment page link

Well done, @Dinesh_Sake! :medal_sports:

I have only one small improvement:
You should prefer unitless numbers for line-height. For example line-height: 1.5; for the header title. For the reason why see this example on the line-height article.

Cheers,
Michael

2 Likes

I’ll keep that in mind :smiley: Thanks for the insight.

1 Like

Hello, I have a question based on your code. In article section, if I put img src under the p, the image doesn’t stay in place. It goes under the container. Why does that happen?

Hi @Lowi and welcome to the community :wave:

The reason for this behavior is that the image is floated to the right (float: right;). This means that it is put on the right side and other elements that come after in the same container will flow around. When you put it after the <p> the image will still be on the right side, but since the <p> is first, the image will be after the <p>.

To understand it better you could see what happens when you

  • remove float: right; from .card article img {}
  • change it to float: left;

Also have a look at the MDN article about float (Especially the “Try it”).

I hope that helps,
Michael