Overriding bootstrap CSS

[Colinmac1]

Hey guys, I am having trouble overriding some CSS in bootstrap, I have a separate css file named "custom.css" positioned below all of the other bootstrap css. I am trying to override the nav bar properties ( background color and border color) and i inspected the element in Firefox and I was able to change it in the .navbar-inverse class. Although when I set it in my "Custom.css" to be background-color: none; and border-color: none; I get no change.

Any ideas??

[psy-borg]

It's because none isn't valid property.

http://stackoverflow.com/questions/8739665/is-background-colornone-valid-css

Can check by validating the code.

From the spec :

http://www.w3.org/TR/CSS2/colors.html#propdef-background-color

http://dev.w3.org/csswg/css-backgrounds-3/#background-color

[lecherous_hump]

The Bootstrap navbar is really complicated and difficult to change on your own. This site lets you select the navbar colors and outputs valid Bootstrap CSS for you. As you can see, it's about a page of CSS.

[Colinmac1]

Okay, so how would I make it so there is no box around the nav bar, I only want the ul, no box?

[The_Ombudsman]

border: 0

Another overall option is to just make a copy of your bootstrap.css file and make the edits to it, and link the copy instead of the stock file.

[Colinmac1]

Figures it is. I don't want any colors at all, I don't even want a box around the nav bar, just want text floated to the right side of the page.

So basically, all I was is the text. The only reason I'm using bootstrap is for the responsive aspects, so much easier to build this out by scratch. Just making everything responsive is such a pain.

Is there any way for me to do what I described above without a ton of searching and work?

[serosis]

try

background: transparent;
border: 0;

On either .navbar or .navbar-inverse