View Full Version : Prevent Positioned Div from Overlapping

11-08-2010, 10:56 PM
Hi there--I've been quite baffled with a request from a client.

I basically want my #content_box DIV to be aligned to the bottom right corner of the window at all times, however, when the window is shrunk, I want #content_box to stop moving at a certain point so it doesn't overlap other elements on the page.

Currently I have #content_box set to position:absolute. I read that if the parent DIV of an asolutely positioned DIV has a min-width set, then the DIV within should stop moving when the parent's min-width is reached. Unfortunately that's not working for me :/

Here's a link to the current website: http://www.grafikintervention.com/ (http://www.grafikintervention.com)

Any help would be greatly appreciated! I hope I've explained everything decently.

11-09-2010, 07:13 PM
Bumpity bump.

11-09-2010, 07:30 PM
It's doing exactly what you are telling it to do. You positioned it fixed at the margins you specified. That means no matter what the browser window size, it will always be at thos exact margins.

Instead of using position at all....did you try floating your div left?

#divName{float: left; margin-left: .5em; margin-bottom: .5em}

Play with the em measurements.