Cross browser compatible HTML table cellspacing and CSS border-spacing property

by Yang Yang on March 23, 2009

Share This Article:
Subscribe to Kavoir: blog feed

As a result of the failure of IE (IE6 and IE7) browsers to implement the border-spacing CSS property for HTML tables. The mere CSS rules below:

border-spacing:2px;
border-collapse:separate; /* border-spacing will be ignored should border-collapse:collapse;*/

Have no effect of widening the cells distance on IE.

To enable border spacing and cells gap, you will not only use the above rules in your CSS (for FF2, FF3, Opera 9.5, Safari 3 and Chrome) but also add the HTML table cellspacing property (for IE6 and IE7) to the table in HTML:

<table summary="" cellspacing="2">
...
</table>
Share This Article:
Subscribe to Kavoir: blog feed

You should also read:

{ 3 comments… read them below or add one }

web design and development April 10, 2009 at 11:31 pm

i think it will also be a good approach to write separate CSS for multiple browsers.

Reply

Joseph June 25, 2009 at 2:41 am

helpful post, thanks a lot

Reply

Some guy from internets September 24, 2010 at 6:18 pm

You saved me a couple of minutes. Thanks!

Reply

Leave a Comment

Previous post:

Next post: