1.

Solve : Horizontal Scrolling with absolute positioning inside relative positioning?

Answer»

Hi, I have a similar problem to with this EXAMPLE...

http://dustyreagan.com/writing/1/example2.html

When the page is shrunk horizontally, (but not so much as to cover the contents)
it creates a horizontal scroller.
If the red box is removed, this scroller is not seen.

Anyway to get rid of the scroller until it is actually needed?

ThanksYou're better off not using absolute positioning at all on a centered layout.Can you recommend anyway of replicating that page without absolute positioning?

ThanksWhere do you want to box to be exactly?Basically, a large box positioned centrally on the screen.

Then I need images within it to be fixed at certain positions within it.
So when the browser is stretched, the large box REMAINS in the centre.

I'm sure its possible, but I don't know how.

Thanks for any help.I assume when you say "large box" you're talking about the red box? Or is it the #wrapper div?Yes, the large box is the #wrapper div.

The small ones would be images, like the red box is, which I require to be at specific positions within the large box, such as (x,y), where (0,0) is the top left corner.Okay.

This is the CODE which I'm wondering about:
Code: [Select]<div style="position:relative;top:30px;left:200px"&GT;
<img src="sample.gif" style="position:absolute" height="50" width="100" alt="our img" />
Remove that and just add the style it has directly to the image. Leave the "position:absolute" on the image, and forget about relative positioning for now - that might be affecting the parent 's style.Thanks,

Well if I do that...

http://www.math.colin-java.co.uk/test.htm

It half WORKS, but I don't seem to be able to position the image at (x,y)
If I try to, it just does it relative to the corner of the screen..

Any thoughts?Yes, all you do now is set your "top:20px", "left:50px" etc. on the image. That should do it.It doesn't, it just puts it at the position relative to the top left corner of screen,
which is of no use.

It sort of works if I set it to relative, but then I can't get multiple images to show properlyAbsolute positioning is fine on a centred layout, providing the outer div/container has its position set to relative.  Then inner content can be set to absolute, but it's absolute relative to its parent container.  Yes I know it's counter-intuitive...



Discussion

No Comment Found