Getting rid of container padding

Hey guys,

Can anyone please help me get rid of the container padding around the banner on this website? http://tinyurl.com/p2le55u

That’s a bit vague.

.header has a 10px bottom margin, is that the extra space you were talking about? Please elaborate.

If you are talking about the banner take up the full width of the container, then you need to nest it outside of hte container parent. The parent has 20px padding on it which makes the image more restricted. It would be best to just take it out of hte parent.

As Ryan said you have 20px padding on .container so you would either need to move your banner out of that element (as I assume the 20px padding is a site wide requirement) or instead use some negative margins t shift the element over.

e.g.

.body .container{padding:0 20px}
.header{margin:0 0 0 -20px;}

Of course you still need to sort out the smaller layouts with your media queries.

Note that when you use a grid css then you need to stick to the grid and not modify components explicitly but rather over-ride defaults where needed with a modifying class.

Thank you for your responses, have added padding-right:40px to the p tag which seemed to work :smile:

Now I have to figure out how to fix the nav-stacked and nav-pills to look like the original site

Was that a question or just thinking aloud :smile:

1 Like

Hey Paul,

Definitely a bit of both :wink:

Well just shout if you need help with specifics and we’ll try to help.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.