View Full Version : Position: Absolute, not relative to <DIV> in AJAX Navigation??

Jul 21st, 2009, 07:38 AM
Hi there one and all,

I'm new to the whole <DIV>, AJAX scene, but it's going pretty well so far.

I do however have a query...

I use a layout that many people applying the AJAX navigation styling have adapted... that is, left and right margins with some funky background in it... then down the center of the page, top heading with navigation bar, content area in the middle, with a footer below. All seperated with various <div>s.

All is fine with that. The problem I'm having is that, as a web developer, people accessing my site will obviously be viewing it in different resolutions and therefore things will look different on various peoples PC's. To overcome this, I limit the width of the #content <div> to 900px.

However, when I come to 'position: absolute' images, etc. on the page i'm displaying in the content window, it uses the entire #wrapper <div> when working out where to place my lovely image, as opposed to the #content <div>...

Because of this, I can't really position images properly, as someone viewing on, for example, a widescreen monitor (say, 1440x900), will have a greater left hand margin, which will make my image appear in the wrong place.

Does anyone know of a method to set the 'position: absolute' relative to the #content <div>, as opposed to the entire page? (if that makes any sense)

Or am I living in a dream world? If so, can anyone suggest a suitable work around for my predicament?

Thanks in advance fella's. :thumbsup:

Jul 21st, 2009, 07:43 AM
Make your content div position:relative but why are you using absolute positioning in the first place? Chances are you are abusing it and not using it properly. Its almost always never needed unless you are doing a multi level navigation drop down.

Jul 21st, 2009, 06:20 PM
Thanks a lot compadres,

I realise that this isn't really ideal, but I may wish to have images overlapping each other as the site develops, or have text writing over transparent areas of larger images.

Either way, it's one of those things which is just nice to know, and EVERYTHING learnt is worthwhile and will come in handy sooner or later.

I'm a little new at non-table layouts, and am still getting to grips with how everything relates to each other.

Anywho, thanks for the reply, worked like a charm. =)

PS: Why is it wrong to abuse absolute positioning? (just outta curiousity)

Jul 22nd, 2009, 04:37 AM
Because most of the time the people who use absolute positioning use it for everything. In most cases its only needed for instances of overlapping but not really if you want to position something on the page when there are other ways to do the same thing.