CODEWITHSUNDEEP
iostwitter-bootstrapnavbar
Braden Katzman
Braden Katzman

Reputation: 11

Bootstrap navbar problems on iOS

I'm working on a personal website, and my Navigation Bar is coming up just fine on my laptop, but it's having some issues on iOS. On OS X, the NavBar shows each < li > as a separate button, but on iOS the navbar shows the "navbar-brand" button on the left and then a button which seems to be a dropdown menu on the right.

I assumed this button was because of the collapsed view, and would therefore bring up my buttons in a dropdown menu. Unfortunately, this is just a dead button, and nothing comes up when pressed, so I have no way of accessing the original buttons.

Here's the navbar:

<nav class="navbar navbar-default navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
      <span class="sr-only">Toggle navigation</span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="#">Braden Katzman</a>
  </div>

  <div id="navbar" class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
      <li class="active"><a href="index.html">Home</a></li>
      <li><a href="/templates/education.html">Education</a></li>
      <li><a href="/templates/workExperience.html">Work Experience</a></li>
      <li><a href="/templates/csSkills.html">CS Skills</a></li>
    </ul>
  </div><!--/.nav-collapse -->
</div>

Any suggestions? Thank you in advance!

Upvotes: 1

Views: 1222

Answers (1)

Tugzrida
Tugzrida

Reputation: 521

I can't see any errors with your code.

Have you included JQuery, the Bootstrap JS and Bootstrap CSS? Remember that JQuery needs to be included before the Bootstrap JS.

Upvotes: 2

Related Questions