Here's my prob.
I'm redesigning my website (<!-- w --><a class="postlink" href="http://www.eyecravedvd.com">www.eyecravedvd.com</a><!-- w -->) and am attempting to place everything centered in a 768px wide table.
I want to place my logo superimposed on top of the table using the
style="position:absolute
and defining the paramaters, but if someone with a screen res larger than 800x600 visits the site, the logo won't be where I want it to be. Does anyone know how I can work around this or define it so that it will always be with the table, which will always be the same size?
Thanks.Well I can't see on your web-site which image you are referring to, so I'm just going to give a series of general answers.
If you want the image to be centred on the page, do this:
position:absolute;left:50%;left-margin
minus half the image width);
That will centre it on any screen but not necessarily centre it in the table (unless your table is also centred). If you want, you could put the image as the first thing in the table and do something like this:
<table style="position:absolute;"><tr><td>
<img src=http://www.webdeveloper.com/forum/archive/index.php/"lavalamp.png" style="position:absolute;left:50%;margintop margin) (right margin) (bottom margin) (left margin);">
you can change the margins to position the image pixel perfect on the page and it will look the same in all browsers and on all resolutions.
Hope this helps but I can't do more without seeing an exmple page of what you're trying.<!-- Boy what a bad case of tableitis! -->
A common technique is to position the image at 50%/50% and then set the top and left margins to negative values that are half the height and width respectively of the image. This works great with a CSS layout but I'm afraid it'll take a lot of extra work with that complex table layout you've got.Here's an image of what I'm attempting to do. I think I may have figured it out though. I may have to create an 800px wide table and force the image to stay within that.
I'd prefer not to use a table and do it mostly CSS for the header.
I'm redesigning my website (<!-- w --><a class="postlink" href="http://www.eyecravedvd.com">www.eyecravedvd.com</a><!-- w -->) and am attempting to place everything centered in a 768px wide table.
I want to place my logo superimposed on top of the table using the
style="position:absolute
and defining the paramaters, but if someone with a screen res larger than 800x600 visits the site, the logo won't be where I want it to be. Does anyone know how I can work around this or define it so that it will always be with the table, which will always be the same size?
Thanks.Well I can't see on your web-site which image you are referring to, so I'm just going to give a series of general answers.
If you want the image to be centred on the page, do this:
position:absolute;left:50%;left-margin
minus half the image width);That will centre it on any screen but not necessarily centre it in the table (unless your table is also centred). If you want, you could put the image as the first thing in the table and do something like this:
<table style="position:absolute;"><tr><td>
<img src=http://www.webdeveloper.com/forum/archive/index.php/"lavalamp.png" style="position:absolute;left:50%;margin
top margin) (right margin) (bottom margin) (left margin);">you can change the margins to position the image pixel perfect on the page and it will look the same in all browsers and on all resolutions.
Hope this helps but I can't do more without seeing an exmple page of what you're trying.<!-- Boy what a bad case of tableitis! -->
A common technique is to position the image at 50%/50% and then set the top and left margins to negative values that are half the height and width respectively of the image. This works great with a CSS layout but I'm afraid it'll take a lot of extra work with that complex table layout you've got.Here's an image of what I'm attempting to do. I think I may have figured it out though. I may have to create an 800px wide table and force the image to stay within that.
I'd prefer not to use a table and do it mostly CSS for the header.