This Ie and Ie6 Hack with Only CSS

This IE and IE6 hack with only CSS?

to trick IE6 just put "_" before any property, for example

   #botonHome .contButton p a span input{  _display: inline; _margin:0px; _padding:0px; _bottom:0px; _height:20px; }

UPDATE:

follow this link for css IE hacks

How to write a CSS hack for IE 11?

Use a combination of Microsoft specific CSS rules to filter IE11:

<!doctype html>
<html>
<head>
<title>IE10/11 Media Query Test</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<style>
@media all and (-ms-high-contrast:none)
{
.foo { color: green } /* IE10 */
*::-ms-backdrop, .foo { color: red } /* IE11 */
}
</style>
</head>
<body>
<div class="foo">Hi There!!!</div>
</body>
</html>

Filters such as this work because of the following:

When a user agent cannot parse the selector (i.e., it is not valid CSS 2.1), it must ignore the selector and the following declaration block (if any) as well.

<!doctype html><html> <head>  <title>IE10/11 Media Query Test</title>  <meta charset="utf-8">  <meta http-equiv="X-UA-Compatible" content="IE=edge">  <style>    @media all and (-ms-high-contrast:none)     {     .foo { color: green } /* IE10 */     *::-ms-backdrop, .foo { color: red } /* IE11 */     }  </style> </head> <body>  <div class="foo">Hi There!!!</div> </body></html>

Which css hacks for IE 6 and 7 are future proof?

none.

Use IE conditional comments to insert your per-version (no pun intended .. well maybe a little) styles..


[update]

Additional notes to your altered question.
It might be time consuming but it is the best-practice (btw many of the hacks are not valid css)..

Using hacks can never be guaranteed, even for the same major versions of a browser .. It is unlikely that they will fix a css bug in IE6 in future minor releases, but still you can not be 100% certain..

There is an alternative (perhaps more time consuming at first), the IE comments i mentioned, but it is truly the best practice...

Besides, think about the other coders in your team who all must know, understand and remember in the future the same hacks.. Over time it will become more time consuming to maintain the hacks than to maintain distinct versions of the offending rules in other files..

CSS method to include IE6 hacks

Is it possible to combine them like

* html @import url(ie6hacks.css);

No. at-rules like @import are not selectors, so cannot be combined with other selectors.

There are ways to make at-rules work as hacks, for example this:

@import url(/* no! */iehacks.css);

will be loaded by IE6/7 but not the other browsers. However, I wouldn't recommend using it; this sort of thing can be really fragile. This particular example is also invalid CSS.

As Daniel says, if you want separate .css files for hacks, the best approach is a conditionally-included link tag. The beauty of “* html” is that you can put hack-rules in the same stylesheet, which is easier to manage if there are only a few of them; if you're having a separate style sheet anyway, it offers no advantage.

IMO “* html” for IE6 is the only hack it's still legitimate to use today. All the box model stuff is dead along with IE5 — assuming you're not using IE6 Quirks Mode, which you shouldn't — and the other browsers, even IE7, are generally too good to be able to attack with a simple hack; the few hacks that can target them are too complex/fragile/invalid to really use.

(And as the inventor of the Simplified Box Model Hack, I say a hearty good riddance to them.)

How to Identify Microsoft Edge browser via CSS?

/* Microsoft Edge Browser 12-18 (All versions before Chromium) */

This one should work:

@supports (-ms-ime-align:auto) {
.selector {
property: value;
}
}

For more see: Browser Strangeness

is there any IE8 only css hack?

Use conditional comments in HTML, like this:

<!--[if IE 8]>
<style>...</style>
<![endif]-->

See here: http://www.quirksmode.org/css/condcom.html

You can test for IE versions reliably and also be sure other browsers won't be confused.



Related Topics



Leave a reply



Submit