0

I am using bootstrap navbar and I have a collapsible navbar. But I am facing a strange problem, whenever I am going to open my site on small devices i.e mobile phone or tablet (actually for which devices I need the collapsible navbar), it is by default opening the navbar. This should not happen. If I click on the navbar button (three line button) then only the navbar should expand. But my navbar is expanding first time by default on small devices.

Here is my code:

<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header"><%= image_tag("logo.png", alt: "industryPrime") %></div>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
  </button>

 <div class="navbar-collapse collapse in" id="myNavbar">
 <ul class="navigation pull-right">
 <li class="dropdown">
    <div class="dropdown">
<button id="feature_button" class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown" style="background-color: transparent; color: #51a3af; border: none; font-size:11px;">FEATURES
<span class="caret"></span></button>
<ul class="dropdown-menu">
    <li><a href="#" class="scroll-link" data-id="paperless_purchase_section">Paperless purchase</a></li>
    <li><a href="#" class="scroll-link" data-id="efficient_stores_section">Efficient stores</a></li>
    <li><a href="#" class="scroll-link" data-id="peace_of_mind_section">Peace of mind</a></li>
 </ul>
 </div>
 </li>

      <li>

        <%= link_to "Case Study", user_maan_case_study_path %>
      </li>

      <li class="req_demo">

        <%= link_to "Request Demo", user_request_demo_page_path , :onclick => "demo_clicked()" ,:onmouseover => "start_count()" , :onmouseout => "stop_count()" %>
      </li>



        <li id="Login button section"><%= link_to 'Login', {controller: 'sessions', action: 'new'} %></li>



        <li><a href="#" class="scroll-link" data-id="contact">Contact Us</a></li>
        <li><%= image_tag("contact_us.png") %>+91 98302-15353</li>
    </ul>
    </div>
  </div>
 </div>
</nav>

My website link is http://www.industryprime.com

please help me to fix it.

Thanks in advance!!!

1 Answer 1

2

Please remove class in in <div class="navbar-collapse collapse in" id="myNavbar"> . Hope it will help you.

1
  • Most Welcome :)
    – Swapna
    Nov 28, 2016 at 10:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.