开发者

IE conditional in the stylesheet

I am trying to line up the top border of a content div with the bottom borders of an <li> list u开发者_StackOverflow中文版sed for navigation right above (like a tabbed pane). In IE the alignment (or the margin I set) is off by 1 pixel.

Is there any way, directly within the css so that I don't have to create a separate IE stylesheet, to put a condition that will set the margin to IE's liking? OR, if the issue I'm having with IE being off by 1 pixel jumps out at you I'd love to hear why so that I can avoid the IE hack altogether (I know I haven't posted any code yet). Thanks!


Yes, there is.

.myclass { *margin: 1px; }

This works for IE6 and IE7, do you need a hack for any other specific version?


Sergey is correct with that CSS hack, check this page out to see why it works. http://www.webdevout.net/css-hacks

Also, try this, It's more of a 2 part setup and involves a bit of markup, but is (in my opinion) cleaner and more flexible than CSS hacks and IE only stylesheets.

In the HTML, add an extra div (a few for each version of IE you want to target)

<body>
<!--[if IE 6]> <div class="IE6"> <![endif]-->
<!--[if IE 7]> <div class="IE7"> <![endif]-->
...
<!--[if IE 7]> </div> <![endif]-->
<!--[if IE 6]> </div> <![endif]-->
</body>

Then in your stylesheets, you can add classes inline to target the IE versions.

.className { ... some styles ... }
.IE6 .className { ... some styles to fix IE6 only ... }
.IE7 .className { ... some styles to fix IE7 only ... }

It's a bit of a twist on the conditionally stylesheets, only conditional styles.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜