Twitter Bootstrap Background Color/Container Color

Question

I have a bootstrap theme for my WordPress site and I'm trying to recreate the theme in another page.

www.bleep.io/blog

The theme has a grey background but the container div is white - giving the impression of a grey border.

I've tried to recreate this by setting the body background color and the container background to white. But this turns the nav-bar white too.

Any ideas how I do this?

Give the navbar an explicit colour in that case? Hard to tell without an example. Can you link to your project so we can see what's going on? — user463231
@Mat I tried your suggestion and gave the navbar a specific background. Seemed to work www.bleep.io/contact2.html — Nick Latocha

Jeremy John Jeremy John · Accepted Answer · 2012-11-21T19:01:01

Hi there from what you are saying you want to have a white background same as the twitter bootstrap css design but you can't change the body to white.

So you need to find this code as your body has a class added to it's tag, find for this in your page template (should be just before the <body> tag):

<style type="text/css" id="custom-background-css">
body.custom-background { background-color: #d4d4d4; }
</style>

that is what you are looking for to change the background color.

EDIT:

Try finding and changing this:

.container {
background-color: #D4D4D4;
margin: 0px auto;
padding-right:24px;
padding-left:24px;
}

and this:

<style>
body {
padding-top: 60px; 
}
</style>

Please also check your css file on the page http://www.bleep.io/contact.html as it's a broken link and it may be the cause of that:

<link href="assets/css/bootstrap-responsive.css" rel="stylesheet">

Twitter Bootstrap Background Color/Container Color

2 Answers