Html/CSS svg sprites

1

Hello guys! I am having some trouble with svg sprites in Icons component part 3 HTML/CSS course.
I followed the same instructions but there is no icons displayed in my “Chrome”browser.
I created the sprite file from the svgsprint.es website and downloaded that file and pasted it on the images folder.
And followed the same instructions but my browser doesn’t display any icons that i wanted to display.
Can anyone help me to solve this issue?
Thanks

Code:

Document

CSS:
/* Icons */

.icon {
width: 50px;
height: 50px;
margin: 0.5em;
}

2 
<meta charset="UTF-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<link rel="preconnect" href="https://fonts.gstatic.com" />

<link

  href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap"

  rel="stylesheet"

/>

<link rel="stylesheet" href="css/normalize.css" />

<link rel="stylesheet" href="css/styles.css"/>

<title>Document</title>

<svg class="icon">

  <use xlink:href="images/sprite.svg#wordpress"></use>

</svg>
1 Like
3

I have the same issue.

1 Like