Absolutely positioned div on right causing scrollbar when the left doesn't

Question

I\'m trying to \"flank\" a centered div with some design elements that are absolutely positioned outside the main div\'s width. I\'m getting a scroll bar due to the element

Answer 1

You're getting a scrollbar only when the viewport's thinner than the main plus that right box, right? (Don't think that was clear to some people.) This is expected browser behavior for content overflow.

Depending on what you want to happen (why do you want it to disappear in this circumstance, if you do?), you could set overflow:hidden on .wrapper. That would always hide it--if you're looking to dynamically display it on some other event, that'll work.

If I'm not mistaken, though, you just don't want it to show when their viewport's only 960px wide. AFAIR you can't do that without some js/jQuery. My suggestion would actually be--especially if you don't want to mess with javascript--if you want this content to be visible at all, accept the scrollbar at narrow widths. It might irk you as a designer, but most people won't notice it, and those who do can still access your content--which is a win, right?