title: Bootstrap Navbar CSS
body: <p>I've taught myself CSS from things online so far.  I feel like I'm doing pretty good but I'm having a heck of a time trying to edit the navbar.  I'm working with Boostrap at the moment but I have a question about CSS, in particular Navbar functionality.</p>
  
  <p>I understand how the HTML refers back to the bootstrap.css but while trying to work own the custom css (style.css) I cannot get the navbar to change colors with a top level class.  For example changing navbar or navbar-inverse with: .navbar { background-color: white; } won't change the background.  I have to go into .brand to change one of the boxes color.</p>
  
  <pre><code>  &lt;div class="navbar-wrapper"&gt;
    &lt;!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. --&gt;
    &lt;div class="container"&gt;
  
      &lt;div class="navbar navbar-inverse"&gt;
        &lt;div class="navbar-inner"&gt;
          &lt;!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. --&gt;
          &lt;button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
          &lt;/button&gt;
          &lt;a class="brand" href="#"&gt;------------&lt;/a&gt;
  </code></pre>
  
  <p>Something is overriding it so my question is more from a basic level.  Do I have to set the exact element or does the CSS allow me to change an overarching class and it applies to things within that div.  </p>
  
  <p>My second question is: is bootstrap.css overriding my custom css?</p>