(HTML)Icon is duplicated with unknown reason-CodePudding

I was learning some features of Html and I was trying to link an url to an icon, but it somehow made 4 icons although I only wrote once. This is the part where caused the problem

<head>
<link rel="stylesheet" href="style.css">
<title>Document</title>
<script src="https://use.fontawesome.com/ca04587938.js"></script>
</head>
<body>
<nav >
    <div >
        <a href="https://www.youtube.com">
            <i >
        </a>
        <span >Youtube</span>
    </div>
    <div ></div>
</nav>

And, this is the result

CodePudding user response：

The icon appears multiple times since you forgot to close your <i> tag.

So instead of:

<i >

write:

<i ></i>