Bootstrap Navbar Help!

Bootstrap Navbar Help!
0

#1

I am desperately trying to get a navbar to display horizontally. I’ve tried:
.nav li{
display: inlineblock;
}
I’ve tried naming the list various different class names and then assigning inline block to them. I’m attempted adding “pull-left” as a class to all my li elements. I’ve searched the web for the past 2 hours trying to figure this out. All of the tutorials for navbar give a block of code, show a functional horizontal navigation bar which even when I copy past into codepen comes out vertically. What am I doing wrong?

Here is my ratchet code:

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<nav role="navigation" class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href"http://codepen.io/DrFillGood/pen/ZKKOvR">Patrick's Portfolio</a>
    </div>
      <ul class="nav navbar-nav navbar-right">
        <li class="active pull-left"><a href="http://codepen.io/DrFillGood/pen/ZKKOvR">Home</a></li>
        <li class="pull-left"><a href="#">About</a></li>
        <li class="pull-left"><a href="#">Contact</a></li>
        <li class="pull-left"><a href="#">More</a></li>
      </ul>
    </div>
</nav>

#2

Use the 3.3.7 version of Bootstrap and try again… Codepen automatically sticks in the 4.0 version, but its super brand new or about to be luanched…so all the guides are for the 3.37 version, not the new one. Check here: http://getbootstrap.com/getting-started/


#3

Thank you so much, was going insane.


#4

No prob! It happened to me too…glad I could help!


#5

I cleaned up your code.
You need to use triple backticks to post code to the forum.
See this post for details.


#6

Thanks kev, had tried lots of different things before giving up and linking my codepen.