Build a Heart Icon - Step 6

HTML-CSS
1

Tell us what’s happening:

I am setting the fill attribute to SVG but still it is showing that step in not done

Your code so far

<!Doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Heart Icon</title>
  </head>
  <body>
    <svg width="24" height="24" viewBox="0 0 24 24" >

<!-- User Editable Region -->

  




<svg width="24" height="24" viewBox="0 0 24 24" fill= "red">
  <path d="M12 21s-6-4.35-9.33-8.22C-.5 7.39 3.24 1 8.4 4.28 10.08 5.32 12 7.5 12 7.5s1.92-2.18 3.6-3.22C20.76 1 24.5 7.39 21.33 12.78 18 16.65 12 21 12 21z"></path>
</svg>




<!-- User Editable Region -->

  </body>
</html>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/140.0.0.0 Safari/537.36

Challenge Information:

Build a Heart Icon - Step 6

2

Hello!

It appears there are two svg within the code provided.
It may work if one is removed.

Happy coding!

3

I have removed and tried but its not working

4

please share your updated code

5 
<svg width="24" height="24" viewBox="0 0 24 24" fill= "red">

  <path d="M12 21s-6-4.35-9.33-8.22C-.5 7.39 3.24 1 8.4 4.28 10.08 5.32 12 7.5 12 7.5s1.92-2.18 3.6-3.22C20.76 1 24.5 7.39 21.33 12.78 18 16.65 12 21 12 21z" ></path>
6

can you please post all the code you have in the editor?

1 Like
7

Hi buddy the existed part is this

d="M10 10 H110 V70 H10 Z"

But in your code the part is this.

You need to replace this with the first one.

Hope this helped.

8 


<svg width="24" height="24" viewBox="0 0 24 24" fill= "red">

  <path d="M12 21s-6-4.35-9.33-8.22C-.5 7.39 3.24 1 8.4 4.28 10.08 5.32 12 7.5 12 7.5s1.92-2.18 3.6-3.22C20.76 1 24.5 7.39 21.33 12.78 18 16.65 12 21 12 21z" ></path>
9

I have tried its not working

10

if that’s all the code you have in the editor you may need to reset the step and try again

11

Your solution works from my end. Please try one of the following steps to move forward.

Click on the “Restart Step” button and force a refresh of your page with CTRL + F5 then try to paste the code in again.

or - Try the step in incognito or private mode.

or - Disable any/all extensions that interface with the freeCodeCamp website (such as Dark Mode, Ad Blockers, or Spellcheckers), and set your browser zoom level to 100%. Both of these factors can cause tests to fail erroneously.

or - Ensure your browser is up-to-date or try a different browser.

I hope one of these will work for you.

1 Like