Assessment wanted for Backgrounds and Borders skill test

hello, here’s the link to the actual task https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Test_your_skills_backgrounds_and_borders , and
here is the link to my work https://codepen.io/daisymzh/pen/rNpPBqR , the question is I don’t know why the finished example has only three stars on the right , while mine has five stars. I also have a question about how to make sure that the heading text does not overlay the image. Hope I can get some help here.

1 Like

Hi @daisymzh95 and welcome to the community :wave:

Here are two hints that will get you further:

  • Move the background to the heading.
  • Add some left and right padding to the heading until it looks like in the solution image.

By the way: When using an online editor like CodePen you should use the code which is linked below the task:

Download the starting point for this task to work in your own editor or in an online editor.

There are some additional styles (like the width of the box) that aren’t visible in the live code boxes on the task page.

I hope that helps. Feel free to ask more questions. :slightly_smiling_face:
Michael

PS: Your email address is visible in your post. I think it somehow ended up in the optional “name” field of your profile. I recommend removing it.

__sorry. I did put the result. :stuck_out_tongue:

1 Like

Hi @roque.nicolas.molina

It would be nice to not just spoil the solution to others. That’s why I gave hints without posting the solution directly. :roll_eyes:
If you have a question yourself it would be better to open a new topic instead of hijacking another users topic.

Michael

1 Like

I’m starting to use the forum. :stuck_out_tongue: sorry.

1 Like

Thanks for removing it. You are forgiven :grin:

1 Like

Thank you very much, your hints are very helpful, I tried on the task page and it worked!

1 Like