PDA

View Full Version : floating picture gallery position dependent on screen res


arnab_be
05-09-2006, 04:38 AM
Hi,
So I've used a lot of stuff from Ranjan's picture gallery tutorial to create:

http://www.myyellowflower.com/yellowflower.html

My scroller for some reason keeps shifting position when this page is viewed on monitors with different screen resolutions.

I tried embedding this layer in a Layout Table but that still didn't fix it.

Ranjan or anyone else, would you have any advice?
Let me know if you need me to stick any code.
Thanks,
Arnab

domedia
05-09-2006, 02:55 PM
The scroller uses absolute positioning, while the rest of the website is centered.

arnab_be
05-09-2006, 04:58 PM
let me change the absolute positioning of the scroller and see if that fixes it. i'll let you know.

ranjan
05-09-2006, 05:07 PM
Stick the absolutely positioned container in a relatively positioned div

eg.

<div id="relativePositioned">
<div id="container">
...
</div>
</div>

Use the following style to center "relativePositioned" container

#relativePositioned {
position: relative;
margin : 0 auto;
}

arnab_be
05-11-2006, 10:14 PM
so I made a quickfix by just aligning everything to the left.

The only problem now is inter-browser compatibility -

http://www.myyellowflower.com/yellowflower.html

works fine for IE. But the layer is slightly displaced in Mozilla Firefox.

The background image for the blow-up layer is the first blow-up from the ones you would get by clicking on the smaller thumbnails as default.

The reason I did this was so that there isn't a blank space when the page first loads. The shimV doesn't serve the purpose since that would be requested for only a mouse event.

Do you know how I could fix this functionality for Firefox?

Thanks in advance again.