Overriding Problem?? - Defies the CSS Laws

[matt blank]

Hi guys,

In my style sheet I have:

#container {display: table-cell}
#container {display: inline-table}

It literally looks like the above, so that one is below the other. The rules of CSS would say that all browsers should therefore display inline-table as that should override the one above.

But it doesn't...well at least not in Firefox! I needed the two rules to apply to two different browsers, table-cell for Firefox and inline-table for Safari. To my amazement that's exactly what happens! While I'm happy about this, I don't understand it.

I've defied the laws of CSS. Can anyone explain how or why this happens?

Thanks!
Matt

[boogyman]

I am not sure about the table properties in browsers, but if a browser doesnt support the property/value of some selector then it will be ignored. maybe that is what is happening here?

[matt blank]

Hi boogyman,

I thought that too...was my first logical thought.

So I took off the one that Firefox needed and just left the one on it was ignoring (the latter one which it should have picked up).

This made everything go wrong in Firefox, so that threw out that idea

Matt