z-index problem

Oliver wrote:

Gus Richter schrieb:

Oliver wrote:

Because the table is samller than where the image should appear.
The image should always be on the very left of the screen, while the
table is centered to the screen. Thus i can't put that image into the
background of the table.
Thanks anyhow, u have another idea?



You have a positioned image partially obscurred by an overlapping
table and the image is greater than the table itself. The position of
the image and that of the table are required to remain as is. The
image is required to extend into the table as a background image of
the table.

The solution here is to keep the image which is partially hidden by
the table, use the same image as a background image in the table and
position this background image such that it seems that it is one image
extending into the table are. The idea is that if the background image
is moved outside of (beyond) the table border, that portion will not
be visible. Since the background image applied to the table is
background-attachment:scroll by default, the reference is to the top
and left edges of the table. So by applying negative values to
background-position for the background image of the table until it
abuts seamlessly with the other identical image will result in what
seems to be one complete image.
i.e. background: white url(./1.gif) no-repeat -??px -/+??px;

If the requirement is to have the image portion outside of table to
also be a background image, then place the table inside a div and
apply the image also as a background image to the div using the same
declaration as for the table but with different positive
background-position values. It may also be necessary to position the
div itself depending on the need. In anticipation of further
difficulties, it may also be necessary to place the table within
another immediate div in order to position the table.

The concept is simple - the solution and explanation longer than I
expected or I went into too much detail and hopefully did not confuse.

hey,
ok i did manage to get it right. i used a surroundig div tag for the
table and added a background with the gif and used background-position.
Thanks for your help

I'm glad you were able to make sense out of my ramblings. ;-)

--
Gus

Gus Richter schrieb:

Oliver wrote:

Gus Richter schrieb:

Oliver wrote:

Because the table is samller than where the image should appear.
The image should always be on the very left of the screen, while the
table is centered to the screen. Thus i can't put that image into
the background of the table.
Thanks anyhow, u have another idea?




You have a positioned image partially obscurred by an overlapping
table and the image is greater than the table itself. The position of
the image and that of the table are required to remain as is. The
image is required to extend into the table as a background image of
the table.

The solution here is to keep the image which is partially hidden by
the table, use the same image as a background image in the table and
position this background image such that it seems that it is one
image extending into the table are. The idea is that if the
background image is moved outside of (beyond) the table border, that
portion will not be visible. Since the background image applied to
the table is background-attachment:scroll by default, the reference
is to the top and left edges of the table. So by applying negative
values to background-position for the background image of the table
until it abuts seamlessly with the other identical image will result
in what seems to be one complete image.
i.e. background: white url(./1.gif) no-repeat -??px -/+??px;

If the requirement is to have the image portion outside of table to
also be a background image, then place the table inside a div and
apply the image also as a background image to the div using the same
declaration as for the table but with different positive
background-position values. It may also be necessary to position the
div itself depending on the need. In anticipation of further
difficulties, it may also be necessary to place the table within
another immediate div in order to position the table.

The concept is simple - the solution and explanation longer than I
expected or I went into too much detail and hopefully did not confuse.

hey,
ok i did manage to get it right. i used a surroundig div tag for the
table and added a background with the gif and used background-position.
Thanks for your help


I'm glad you were able to make sense out of my ramblings. ;-)

Was kinda hard, but after reading it 10 times it made sense.