-
fixed elements on a centered layout
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?
-
i figured out a workaround. the left and right alignment on my fixed element would make it use the browser as its container. the left worked correctly because i didn't define left:0px;
i ended up putting the content i originally had in my container into another div and floated it left. then created a second div after the first closed and floated it right. the second div contained my right shadow. I needed to adjust margins slightly but it looks good in ie7 and firefox even when resizing browser
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules