XHTML Block Table Horizontal Center Align CSS Bug Fix for Internet Explorer 6
Approximately 75% of Internet users still use Internet Explorer with all its bugs and security risks.
Nearly half these users are still using Internet Explorer Versions 6 or below, which have many bugs that interfere with valid XHTML/CSS code. Professional organizations and even governments are still using this substandard browser.
To insure the cleanest possible code for picture pages, you may be making the shift to XHTML strict. Your pages/pictures may appear attractive in your own Firefox browser or when viewed by latest versions of Windows Explorer. However when approximately 40% of the entire population view your pages with Internet Explorer 6 or below your pages may look ugly, as a result of Explorer not centering your tables horizontally.
The normal way of centering tables in HTML 4 was with the <div align=”center”> tag. This tag has now depreciated in XHTML. So now we rely on CSS to do this for us.
However the usual and valid CSS in the following example does NOT work with Internet Explorer 6, as your tables will not be centered- making your photo pages look horrible. The following example is the normal valid way of centering block items such as tables horizontally:
table.center {margin: 0px auto;} or
table.center {margin-left: auto; margin-right: auto;}
The way to get around this bug is to use the following css:
table.center {text-align: left; margin: 0px auto;}
div.center {text-align: center; width: auto;}
Then make your tables you are having problems with look something like this:
<div class="center">
<table class="center">
<tbody>
<tr>
<td align="center">Your Pictures</td>
<td align="center">Your Pictures</td>
<td align="center">Your Pictures</td>
</td
</tbody>
</table>
</div>
Your tables now center perfectly even in Internet Explorer 6. Your page is also 100% valid XHTML strict.
Problem solved.
- Please visit AnxietyMadeWell.Com for natural cures, treatments and self help for anxiety disorders, worry, stress and depression.
- Bookmark this article on del.icio.us