Search code examples
csstwitter-bootstraptwitter-bootstrap-2

Override Bootstrap navbar CSS with my own in Bootstrap 2

I am trying to override the CSS for the navbar in Twitter Bootstrap 2, below is the CSS I see in the console when I expect the element.

// CSS found in the original bootstrap.css
.navbar-inner {
 background-color: #fafafa;
 background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
 background-repeat: repeat-x;
 border: 1px solid #d4d4d4;
 border-radius: 4px;
 box-shadow: 0 1px 4px rgba(0, 0, 0, 0.067);
 padding-left: 20px;
 padding-right: 20px;
}

My CSS to override this class within my own custom.css //

.navbar-inner {
  border: 0px !important;
  border-radius: 0 !important;
  background-color: #ffffff !important;     
}

How do I amend the navbar-inner class in custom.css to remove all the box-shadow/border-radius/background image.. I essentially just want a white background without any border whatsoever.

Solution

  • Of course... i need sleep

    background-image: none !important;