0

I read this answer to another so question, which is exactly what I need. Although, as stated in the answer, it looks bad in IE7. I would like it to look ok in IE7. The first column does not need to be fixed in IE<=7, but the table (and the first column) should be readable.

Does anybody have any idea how to hide some parts of the CSS in IE7, so it looks like a normal table? If so, you can always fork http://jsfiddle.net/emn13/YMvk9/ to show me :)

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Fortega
  • 19,463
  • 14
  • 75
  • 113

2 Answers2

0

You could write a separate stylsheet for IE to use:

<!--[if IE]>
    <link href="/style/ie.css" type="text/css" rel="Stylesheet" />
<![endif]-->

<!--[if !IE]>
    <link href="/style/core.css" type="text/css" rel="Stylesheet" />
<![endif]-->

This will force IE to use the rules you specify in ie.css so you can give it the rules you want there. This will also hide the other parts that are used in Google Chrome and Firefox from IE.

The second stylesheet there will be used only if the browser is not IE so if everything displays correctly in Chrome and Firefox, you can leave those rules untouched. Then just copy the rules you need for IE into it's stylesheet.

Best practice is to write the CSS so that it displays the same in all browsers, but this is a lot less frustrating!

Hope this helps

Reference: http://www.quirksmode.org/css/condcom.html

Ortund
  • 8,095
  • 18
  • 71
  • 139
  • Second one (the one I need) does not work. Are u sure the syntax is correct? – Fortega Sep 07 '12 at 14:26
  • @Fortega I've added a reference link to the answer. My bad, it looks like I did make a mistake there, I've corrected – Ortund Sep 10 '12 at 07:03
-1

I fixed the issues and attached the files http://jsfiddle.net/fJJvG/2/. One thing, you must download the jquery plugin from http://jquery.com/ and put in your header. then you will get the result.

BlackICE
  • 8,816
  • 3
  • 53
  • 91
ram
  • 253
  • 1
  • 5
  • This does not work in firefox. The first column is not fixed anymore, and I see weird signs (});//]]>). Selecting JQuery (on the left) does not make a difference. – Fortega Sep 10 '12 at 07:26