[Wylug-help] Mozilla vs IE CSS differences

Fri Dec 15 12:42:43 GMT 2006

On Friday 15 December 2006 00:50, Dave Hassett wrote:
> Hi Gary,
>
> I think you are falling foul of IE's lack of support for the
> "border-spacing" CSS property, and this is making your tables render
> differently.
>
> http://www.stylegala.com/features/css-reference/border-spacing.htm
>
> Only Gecko (NN6+/Firefox) and Opera support this border-spacing feature.
>
> There are some generic problems with the CSS too I think. You have a
> missing semi-colon on the font line (but I'm not sure whether this would
> have affected things or not). You need a comma between the CSS
> selectors, and the `#dman` bit needs repeating too. i.e. "#dman tr,
> #dman td" rather than just "#dman tr td".  See here for further
> information:
>
> http://css.maxdesign.com.au/selectutorial/rules_group_sel.htm
>
> An easy fix might be to use the "border-collapse" property instead, then
> set the border thickness manually. You loose that "3D" feel to the
> tables, but it will at least render identically in both browsers. Also,
> ensure you are not specifying a `border="1"` attribute on your HTML
> table tag, since that may conflict with the CSS styling.
>
> Here is a test HTML and CSS file which works for me (change the
> '#CCCCCC', light grey, colour to whatever you like).
>
> test.css:-
> ---------------8<---------------
> table#dman
> {
> 	font-size: 10pt;
> 	font-family: Arial, "New Century Schoolbook", sans-serif;
> 	border: 2px solid #CCCCCC;
> 	text-align: center;
> 	border-collapse: collapse;
> }
>
> #dman th, #dman td
> {
> 	border: 2px solid #CCCCCC;
> 	padding: 5px;
> }
> ---------------8<---------------
>
> test.html:-
> ---------------8<---------------
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
>     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
>
> <html>
>   <head>
>    <title>Table Test</title>
>    <link rel="stylesheet" type="text/css" href="test.css" />
>    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
>   </head>
>   <body>
>    <table id="dman">
>     <tr><th>one</th><th>two</th></tr>
>     <tr><td>three</td><td>four</td></tr>
>     <tr><td>five</td><td>six</td></tr>
>    </table>
>    <br/>
>    <table id="unstyled">
>     <tr><th>one</th><th>two</th></tr>
>     <tr><td>three</td><td>four</td></tr>
>     <tr><td>five</td><td>six</td></tr>
>    </table>
>   </body>
> </html>
> ---------------8<---------------
>
> I hope this helps.
>
> Many thanks,
>
> Dave Hassett
>

Hi Dave.

Thanks for this. Having read through what you've said, I made the corrections 
you suggested and tried a few things and now have what I want, both in 
Mozilla and IE.

Cheers

Gary
-- 
Gary Stainburn

This email does not contain private or confidential material as it
may be snooped on by interested government parties for unknown
and undisclosed purposes - Regulation of Investigatory Powers Act, 2000     