-1

Fist of all I am new to css/javascript/bootstrap. All I want is to place this code: 

<i class="fi-guide-dog"></i>

inside my span (or somewhere) so the dog icon shows next to the "Dog" word. Please find my code below:

{%load static%}

<link rel="stylesheet" type="text/css" href="{% static 'toarnatot/style.css' %}" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">


<nav class="navbar navbar-inverse">
    <div class="container-fluid">       
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle= "collapse" data-target ="#topnavbar">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href={%url 'toarnatot:home'%}><strong>ToarnaTot</strong></a> 
        </div>
        <!-- items -->
        <div class="collapse navbar-collapse">
        <ul class ="nav navbar-nav">
           <li class="">
           <a href="{% url 'toarnatot:home'%}">
             <span class="glyphicon glyphicon-something" aria-hidden="true">
            Dog             
             </span>
           </a>
           </li>
        </ul>
        </div>
    </div>  
</nav>
Bogdan Girdea
  • 1
  • 2

1 Answers1

0

Do not put anything inside the span tag , instead create another tag to print the text that you want to display with the glyphicon.

like:

<p>dog</p>
<span class="glyphicon glyphicon-something" aria-hidden="true"></span>
Akshay Aggarwal
  • 237
  • 1
  • 12