I have find a css hack for all Browser (Chrome and Safari, Firefox, IE10, IE9, IE8, IE7). Because there are some properties which creates issue in webkit based browsers like chrome, safari and IE. Let us suppose that we can using this css code:
CSS target Chrome and Safari only
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari and Chrome, if Chrome rule needed */
.selector { property:value; }
/* Safari 5+ ONLY */
::i-block-chrome, .selector { property:value; }
}
CSS target Safari 9 but ONLY on iOS
/* Safari 9+ (iOS Only) */
@supports (-webkit-text-size-adjust:none) and (not (-ms-accelerator:true)) {
.selector { property:value; }
}
CSS target Firefox only
@-moz-document url-prefix() {
.selector { property:value; }
}
CSS target IE10 only
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
/* IE10+ specific styles go here */
.selector { property:value; }
}
CSS target IE9 only
CSS target IE8 only
CSS target IE7 only
Related Tags
More From Oodles
Neha N | 14-Mar-2025
Ready to innovate? Let's get in touch
Cookies are important to the proper functioning of a site. To improve your experience, we use cookies to remember log-in details and provide secure log-in, collect statistics to optimize site functionality, and deliver content tailored to your interests. Click Agree and Proceed to accept cookies and go directly to the site or click on View Cookie Settings to see detailed descriptions of the types of cookies and choose whether to accept certain cookies while on the site.
About Author
Prince Kumar
Prince is a sharp and intellectual UI Developer, he has a good knowledge of HTML. CSS, Jquery. His hobbies are reading books, listening music and net surfing,