rodling
rodling

Reputation: 998

Deconflict Twitter Bootstrap with other CSS and JS

I found a good template with some neat CSS, but my previous code for the main interface uses a lot of Twitter Bootstrap (3). However there is a lot of conflicts between them, primary one I can not seem to fix is drop down menu.

Is there a way to override or isolate Bootstrap or bridge it for the drop down menus. Yes I know there should be more creative object names, but both CSS come with very deep rooted names so changing it is fairly problematic.

HTML is as follows

<nav>
  <ul>
    <li>Option</li>
     <li><span>DropDown</span>
      <ul>
        <li>1</li>
        <li>2</li>
      </ul>
    </li>
   </ul>
</nav>

Upvotes: 1

Views: 80

Answers (1)

Khalid T.
Khalid T.

Reputation: 10567

Bootstrap does not style nav elements that do not have the .navbar class assigned to them.

So, if you happen to use nav with the same bootstrap class name .navbar, you'll have to override the .navbar rules (in addition to its child elements ul and li).

Upvotes: 1

Related Questions