Nevershow2016
Nevershow2016

Reputation: 570

Bootstrap putting circle after navgation

Hi guys following this tutorial for bootstrap This

I have done exactly what was told and it all works fine. However i want it so that i can actually get a circle to be on the right hand side after the navgation menu. However every time i put the div tag in , it does not work and actually puts the logo on the left hand side instead of the right

<div class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">BootstrapBay</a>
    </div>
    <div class="navbar-collapse collapse">
      <ul class="nav navbar-nav navbar-right">
        <li class="active"><a href="#">Home</a></li>       
        <li><a href="#about">About</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Themes <b class="caret"></b></a>
          <ul class="dropdown-menu">
            <li class="dropdown-header">Admin & Dashboard</li>
            <li><a href="#">Admin 1</a></li>
            <li><a href="#">Admin 2</a></li>
            <li class="divider"></li>
            <li class="dropdown-header">Portfolio</li>
            <li><a href="#">Portfolio 1</a></li>
            <li><a href="#">Portfolio 2</a></li>
          </ul>
        </li>            
        <li><a href="#">Contact</a></li>
      </ul>
     <div class = "circle"></div> 
    </div><!--/.nav-collapse -->
  </div>
</div>


.circle{
    background-color: Red;
    border-radius: 50%;
    width: 200px;
    height: 200px; 
    float: right; 
} 

You can see that i have put the circle after the navgation bar. but for some reason its not ending up there , i used the float right command but this does not work , any help on this would be great

Upvotes: 1

Views: 1009

Answers (1)

Nevershow2016
Nevershow2016

Reputation: 570

Ah sorry i have done it, if u stick the <div class = "circle"></div> just below the <div class="navbar navbar-default navbar-fixed-top" role="navigation">and then u can float to the right it will end up there. Sorry for the silly question x

Upvotes: 1

Related Questions