does anyone know how to lock an image/layer in a stable position.
For example right now i have it set to left:262:top:115 and it's perfectly their but when i resize the window it is STUCK at that position, i want to to move realtively to the site.
The way to do that is to first NOT use absolute positioning as you have, and NOT to use tables for layout (and it looks as though you have the div WITHIN a table ???).
Think of a web page as building a pyramid of blocks (except gravity acts from the top left corner) - the position of any block is determined by the size and position of those before it. Natural flow will naturally adapt to screen size changes - the less you try and "force" things into position with absolute positioning, the easier fluid sites are.
hi thanks for that help.....i sort of understand what you mean but not quite maybe you can take a look at my full coding of the page and let me know what i am doing wrong.....
Do you have the site up somewhere? There would appear to be absolutely no content on this site - only graphics. And without the graphics, I cannot tell what you are trying to achieve at all.
All graphics and no content means search engines cannot index the site, non-graphical browsers (including screen readers for the vision impared) cannot read or navigate your site. Building a web site should be about CONTENT - then style that content to make it look the way you want. And this process definitely does NOT involve Imageready slice-and-dice....
If we can see the full layout, then we can steer you in the right direction.
1. For the set content use display:relative
2. Put the overlay inside the set content that has display:relative
3. Add display:absolute to the overlay content and then set the top and left position relative to the set content.
eg.
<div style="display:relative">
Some content
Some more content
<div style="display:absolute;left:20px;top:30px;">
Some content to display over the other content but offset slightly
</div>
</div>
Bookmarks