Sal P.
Sal P.

Reputation: 39

Cannot change background-color property of nav element in CSS

nav {
  background-color: #CC3333;
  border: 5px solid red;
}
     <nav class="navbar navbar-default navbar-fixed-top">    
                <div class="container">
                    <button type="button" class="btn btn-default navbar-btn">About Me</button>
                    <button type="button" class="btn btn-default navbar-btn">Portfolio</button>
                    <button type="button" class="btn btn-default navbar-btn">Contact Me</button>
                </div>
            </nav>

I have no idea why it is not running, so any help would be much appreciated!

Upvotes: 0

Views: 827

Answers (3)

dilli.shrestha
dilli.shrestha

Reputation: 173

If you are using Bootstrap or any other CSS library then it could be some other CSS are overlapping. Please use the Firebug or other browser web developer tools to find out which CSS rule is taking effect.

.navbar-default{
    background-color: #ff0000;}

Try similar like that, you have declared three class for nav, so possible one of three class has rule for the background that is taking effect.

Upvotes: 0

Surya Sekhar Mondal
Surya Sekhar Mondal

Reputation: 179

Your CSS works just fine. I believe you are using Bootstrap. It maybe some browser related issue.

Upvotes: 0

Mike
Mike

Reputation: 66

Your CSS works, it even works right here in Stack Overflow when you click the "Run code Snippet". You probably have other CSS on your page that is overriding this rule.

Upvotes: 2

Related Questions