Is there any way to not change the text font on my menu using fontawesome?

I´m trying to add icons to my menu, but when i add an icon it changes the font of the text next to it.

        <div class="sidebar-heading">
          <a href="?page=home">
            <img src="SGIE/HOME2.png">
          </a>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <a class="fa-solid fa-pen-to-square" href="?page=novo">Novo Pedido</a>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="?page=listar">Equipamentos em Reparação</a>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="?page=listarr">Equipamentos Reparados</a>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="?page=entregues">Equipamentos Entregues</a>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="?page=admin">Admin</a>
        </div>

I tried to add a CSS class to my CSS file but it didn't do anything

Solution

I figured it out

    <div class="sidebar-heading">
      <a href="?page=home">
        <img src="SGIE/HOME2.png">
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="?page=novo"><i class="fa-solid fa-pen-to-square"></i>&nbsp;Novo Pedido</a>
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="?page=listar">Equipamentos em Reparação</a>
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="?page=listarr">Equipamentos Reparados</a>
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="?page=entregues">Equipamentos Entregues</a>
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="?page=admin">Admin</a>
    </div>