> The CSS equivalent of cellspacing is to first set 
> border-collapse to "separate," then set the border-spacing 
> property to whatever value you like (both on the table 
> element). But this is not supported by WinIE, MacIE, or NN4.x.
> 
> Zoe

Angus:

One could also set margins on the individuals cells which function in the
same manner as border-spacing, even over-writing the border-collapse
setting.

Surprise of all surprises though...this won't work in IE either. I don't
know how all the browsers Zoe cited will react to it, but IEWin is a
definite no-go.

The use of MSIE's proprietary CSS expressions might be a consideration
though. I've included a little code snippet below which should allow you to
set border-spacing in MSIE and other browsers. If you set border-collapse to
collapse, IE will still set the spacing, while Firefox at least seems to
ignore border-spacing once collapse is set. Firefox is probably in
accordance with the specs--I didn't look it up, but I'd lay money on it.

Anyway, code below...hope it helps.

Bill Brown
Webmaster, MacNimble.com


Code, as promised. Please ignore the lack of thead, tbody, etc. Also, note
that expressions do not validate and require scripting on the client side,
which the user must have enabled. You can counteract the validation factor
by wrapping the rule in a separate style section and enclosing the style tag
in MSIE's other very popular (ahem) proprietary bit of genius: The
Conditional Comment.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>

<html>
<head>
<title>Untitled</title>
<style type="text/css">
/* <![CDATA[ */
#wCSS {
  border: 1px solid #009;
  border-collapse: separate;
  border-spacing: expression(cellSpacing=20); /* for IE */
  border-spacing: 20px;
  padding: 0;
}
#wCSS td {
  border: 1px solid #009;
  padding: 2px 5px;
  position: relative; /* for IE */
}
#woCSS {
  border: 1px solid #009;
  border-collapse: separate;
  border-spacing: 20px;
  padding: 0;
}
#woCSS td {
  border: 1px solid #009;
  padding: 2px 5px;
  position: relative; /* for IE */
}
/* ]]> */
</style>
</head>

<body>

<table id="wCSS">
  <tr>
    <td>cell one</td>
    <td>cell two</td>
  </tr>
  <tr>
    <td>cell three</td>
    <td>cell four</td>
  </tr>
</table>

<table id="woCSS">
  <tr>
    <td>cell one</td>
    <td>cell two</td>
  </tr>
  <tr>
    <td>cell three</td>
    <td>cell four</td>
  </tr>
</table>

</body>
</html>



___________________________________________________________
$0 Web Hosting with up to 200MB web space, 1000 MB Transfer
10 Personalized POP and Web E-mail Accounts, and much more.
Signup at www.doteasy.com

______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to