Okay, so I am in the process of creating an application to view images in (sort of like lightbox) but need to make it cross browser. The biggest issue that I am having is with browsers like Mozilla/FF and Opera; the image is not being centered on the screen, but instead shown in the top right corner.
I am using something like so:
<table style="width: 100%; height: 100%; position: absolute; top: 0; left: 0;"> <tr> <td valign="center"> <center> <div> <img src="something.jpg"> <br> Caption<br> <small> Image Number </small> </div> </center> </td> </tr> </table>
Which centers the content very nicely in IE 6 (haven’t tested in IE 7 yet) but has no centering in Mozilla/Firefox or Opera.
Does anyone know of a reason that this could be, or how to fix it?