jschnyderite
28 Apr 2009, 03:57 PM
i want to put a shadow on each side of my centered container div using two fixed position images (for scrolling reasons). im already using a horizontally tiled background so i can't use faux columns.
the left image seems to use its containers dimensions and aligns it correctly on the left of its container
#shadow-left{
position:fixed;
top:313px;
}
but the right side aligns to the right side of the browser rather than the container
#shadow-right{
position:absolute;
top:313px;
right:0px;
}
..both images are contained in the container tag. when i try to align from the left 900px or so pixels, it uses the browser for its container as well so different resolutions will have varied results. is there a way to find the center of the browser and adjust the margin/padding?
the left image seems to use its containers dimensions and aligns it correctly on the left of its container
#shadow-left{
position:fixed;
top:313px;
}
but the right side aligns to the right side of the browser rather than the container
#shadow-right{
position:absolute;
top:313px;
right:0px;
}
..both images are contained in the container tag. when i try to align from the left 900px or so pixels, it uses the browser for its container as well so different resolutions will have varied results. is there a way to find the center of the browser and adjust the margin/padding?