css-hack | 易学教程

What is better: CSS hacks or browser detection?

阅读更多关于 What is better: CSS hacks or browser detection?

问题 Commonly when I look around the Internet, I find that people are generally using CSS hacks to make their website look the same in all browsers. Personally, I have found this to be quite time consuming to find all of these hacks and test them; each change you make you have to test in 4+ browsers to make sure it didn't break anything else. About a year ago, I looked around the Internet for what other major sites are using (Yahoo, Google, BBC, etc) and found that most of them are doing some form

How to define specific CSS rules for IE9 alone?

阅读更多关于 How to define specific CSS rules for IE9 alone?

Friends, please help me in defining specific css rule for IE9? For example like this /* IE 6 fix */ * html .twit-post .delete_note a { background-position-y: 2px; } * html .twit-post .delete_note a:hover { background-position-y: -14px; } Note the accepted answer also targets IE10. As such, for a more complete list: IE 6 * html .ie6 {property:value;} or .ie6 { _property:value;} IE 7 *+html .ie7 {property:value;} or *:first-child+html .ie7 {property:value;} IE 6 and 7 @media screen\9 { .ie67 {property:value;} } or .ie67 { *property:value;} or .ie67 { #property:value;} IE 6, 7 and 8 @media

Target IE9 or IE8 but not both using CSS

阅读更多关于 Target IE9 or IE8 but not both using CSS

问题 I know it shouldn't be done, but I just want a quick fix for now and that will give me time to find a proper fix for this. How can I target IE8 alone using CSS because I've tried appending \9 such as: margin:100px\9; However, it also affects IE9 and I don't want that because on IE9 the whole site looks fine. 回答1: From the HTML5 Boilerplate and originally from Paul Irish: Change your <html> tag to this:  <!--[if IE 7 ]> <html lang="en

IE8 css selector

阅读更多关于 IE8 css selector

To target elements only in IE browsers i'll use IE6: * html #nav li ul { left: -39px !important; border: 1px solid red; } IE7: *+html #nav li ul { left: -39px! important; } Does anyone know how to target IE8? Nick I'm not going to get in a debate about whether or not this method should be used, but this will let you set specific css attributes for IE8-9 only (note: it is not a selector, so a bit different than what you asked): Use '\0/' after each css declaration, so: #nav li ul { left: -39px\0/ !important; } And to build off another answer, you can do this to assign variou styles to IE6, IE7,

Conditional CSS rule targeting Firefox Quantum

阅读更多关于 Conditional CSS rule targeting Firefox Quantum

问题 We are having issues targeting Firefox Quantum when it comes to CSS. We know that the following: @-moz-document url-prefix() { .my-style{ } } ...will target all Firefox browsers, but we just want to target Firefox Quantum, since there are some differences between Firefox Quantum and older versions of Firefox when it comes to CSS interpretation. Does anyone know how to do that? 回答1: Perusing the release notes for Fx Quantum 57, specifically Quantum CSS notes, a number of differences between

Make CSS apply only for Opera 11?

阅读更多关于 Make CSS apply only for Opera 11?

问题 Is there a way to make some CSS rules apply only for Opera (11)? 回答1: I love challenges! It took me some time but I finally found it: body {background:0} /* default */ @media not screen and (1) { body {background:red} /* OP 11 */ } @media not screen and (orientation) { body {background:green} /* for the earlier versions of Opera that pick the first media query's rule + chrome/safari */ } browsers tested: red: Opera 11 green: Opera 10 and 10.5 + WebKit browsers none: Opera 9.26 + Firefox 3.6 +

IE8 CSS Hack - best method?

阅读更多关于 IE8 CSS Hack - best method?

问题 Can anyone recommend the best way to hack IE8 styling via CSS, I've recently been making IE8 render as IE7 for ease - but wondered if it was best to add IE8 hacks? 回答1: You should reverse your method. First your site should look good in modern browsers (like Firefox, Chrome, Opera, IE 9), and then you can start worrying about the others. As others suggested, conditional comments can be your friend. First, you should develop your CSS to look fine in the modern browsers. Then check IE8, see

How to define specific CSS rules for IE9 alone?

阅读更多关于 How to define specific CSS rules for IE9 alone?

问题 Friends, please help me in defining specific css rule for IE9? For example like this /* IE 6 fix */ * html .twit-post .delete_note a { background-position-y: 2px; } * html .twit-post .delete_note a:hover { background-position-y: -14px; } 回答1: Note the accepted answer also targets IE10. As such, for a more complete list: IE 6 * html .ie6 {property:value;} or .ie6 { _property:value;} IE 7 *+html .ie7 {property:value;} or *:first-child+html .ie7 {property:value;} IE 6 and 7 @media screen\9 {

Target IE9 Only via CSS

阅读更多关于 Target IE9 Only via CSS

Just wondering given these IE hacks in my bag of tricks "\9" - for IE8 and below. "*" - for IE7 and below. "_" - for IE6. i.e. such as body { border:2px solid blue; border:2px solid yellow \9; *border:2px solid green; _border:2px solid orange; } Whether anyone has such a hack for IE9 ? i.e. I'm trying to target IE9 only via CSS ? meder omuraliev I suggest using condcoms to feed an IE9 css file or have a conditional html class, similar to:   <!--[if IE 8]> <html

IE8 css selector

阅读更多关于 IE8 css selector

问题 To target elements only in IE browsers i'll use IE6: * html #nav li ul { left: -39px !important; border: 1px solid red; } IE7: *+html #nav li ul { left: -39px! important; } Does anyone know how to target IE8? 回答1: I'm not going to get in a debate about whether or not this method should be used, but this will let you set specific css attributes for IE8-9 only (note: it is not a selector, so a bit different than what you asked): Use '\0/' after each css declaration, so: #nav li ul { left: -39px