I have a fixed width layout (based on a grid structure) but I have one pop out element that I want to protrude from the right side.
This works fine, but it means that there is a horizontal scrollbar at 1024 resolutions - the pop out element makes the page too wide.
(see the attached picture for a better idea - Green is the 960 wide page, Red is the pop out element, and the dotted line is the browser window)
With my design it doesn’t actually matter if the popout is off the right of the screen, in fact it works better.
But I can’t think of any way of getting rid of the horizontal scroll bar (short of just turning it off, which i don’t want to do for accessibility reasons). There’s no way to make a browser ignore an element, right?
Also, there’s no way to have a div’s background extend beyond the borders of the div, right? (at least not in most browsers).
I was thinking about absolutes, but I’ve always avoided them so it’s not something I’m familiar with. I’ll start looking into them.
I already have a repeating background on the body element, so I don’t think there’s any way to use another element’s background in that way - except using absolutes (as the parent element would also push the page width out). But using absolutes would probably make it unnecessary anyway.
Thanks for the advice. If anyone else has any other ideas then they’d also be appreciated.
I rarely use absolutes also, but this is the perfect occasion for one. Having things sticking out is a good use for them. Perhaps you could also try a large negative right margin, but I don’t know if that would blow out the design or not.
For the bg image, you could have another wrapper div 100% wide (or any width, really) just for that if you wanted.
Just for my reference, you’re right. Absolutes can go off the left side of the screen without causing a scrollbar (using negative left, or right properties), but they don’t seem to be able to go off the right side.
I also can’t make them go above the top, it just doesn’t seem to move.
Now I’ve tried the simple option, I’ll have a look into the more complex ones…