CODEWITHSUNDEEP
csstwitter-bootstrap
Xtian
Xtian

Reputation: 3587

Twitter Bootstrap Responsive Issue?

I am using the Twitter Bootstrap framework for a responsive/fluid layout.

The top of the website spans across the full width of any screen but when I get down into the content, there is about a 20 px gap from the right side of the screen. This only seems to happen when the screen is small enough to pull in the part of the CSS that addresses:

@media (max-width: 767px){}

You can see a screen shot here:

http://monosnap.com/image/dQ4OD0O8fW7gcbVvXVfTKLbUa

And my test code is hosted here: http://demo.omnigon.com/christian_bovine/show-sxsw/

Like I said, on a large screen its fine, only on smaller screen, and its only the middle content. I have looked at the many times and I cannot see my problem?

Upvotes: 1

Views: 362

Answers (1)

Alan Jenkins
Alan Jenkins

Reputation: 344

You need to remove the negative margins on your #footer css selector. This declaration is essentially forcing your footer to be larger than its parent container.

Typically you would only use this technique when the parent container has padding and you want to negate the parents padding by applying a negative margin to the child element.

Upvotes: 3

Related Questions