First, this code should be validated that it is HTML 5 compliant. I think it will fail.
>Here is a small test. This should be an easy one.
>
>Here is the HTML code:
>
>
><Html>
>
><Head>
>
><Style>
>Table.LXIFrame
>{
> Border-Bottom: #444444 1px solid;
> Border-Left: #444444 1px solid;
> Border-Right: #444444 1px solid;
> Border-Top: #444444 1px solid;
> Border-Collapse: Collapse;
> Font-Family: Arial, Helvetica, sans-serif;
> Font-Size: 11px;
> Color: #000000;
> Background: #FFFFFF;
>}
>
>Table.LXIFrame TD
>{
> Border-Bottom: #CCCCCC 1px solid;
> Border-Left: #DDDDDD 1px solid;
> Border-Right: #DDDDDD 1px solid;
> Border-Top: #CCCCCC 1px solid;
> Border-Collapse: Collapse;
> Font-Family: Arial;
> Font-Size: 12px;
> Color: #000000;
>}
>
>Table.LXIFrame TH
>{
> Background: #E6E6E6;
> Border-Bottom: #CCCCCC 0px solid;
> Border-Left: #CCCCCC 0px solid;
> Border-Right: #CCCCCC 0px solid;
> Border-Top: #CCCCCC 0px solid;
> Font-Family: Arial;
> Font-Size: 11px;
> Font-Weight: Normal;
> Color: #000000;
>}
></Style>
>
></Head>
>
><body>
>
><TABLE Class=LXIFrame CELLSPACING=0 CELLPADDING=2>
><TR><TH>Test</TH></TR>
><TR><TD>Test</TD></TR>
></TABLE>
>
></body>
></Html>
>>
>This page is for the quirk mode. Load it in the browser and see how the table container one pixel black border is all around the table.
>
>Now, add this at the top:
>
>
><!DOCTYPE HTML>
>
>
>See the reaction of the page where the table container one pixel black border is no longer all around the table. If someone can find a way to obtain the same border in HTML5, that would be appreciated.
Craig Berntson
MCSD, Microsoft .Net MVP, Grape City Community Influencer
