{ Snipperize } /ie

New Way to Detect IE with Javascript

If you're not in IE (or IE version is less than 5) then: ie === undefined If you're in IE (>5) then you can determine which version: ie === 7; // IE7 Thus, to detect IE: if (ie) {} And to detect the version: ie === 6 // IE6 ie > 7 // IE8, IE9 ... ie < 9 // Anything less than IE9

Javascript / ie, detect / by ThePeppersStudio (15 days, 18.30 hours ago)

HTML5 Shiv from Google Code

<!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->

XML/HTML / html5, ie, google, googlecode / by ThePeppersStudio (15 days, 18.34 hours ago)

Gradients

Another practical and time-saving technique introduced in CSS3 is the ability to create custom gradients as backgrounds. Although Internet Explorer doesn’t support gradients of the CSS3 variety, it’s pretty easy to implement them for the IE family using proprietary syntax. For the IE filters, the GradientType can be set to “1″ (horizontal) or “0″ (vertical). The Drawbacks Some of the usual drawbacks apply to gradients created with the IE-only filter, along with some other problems. Your CSS won’t validate, although that’s also true for the WebKit and Mozilla values Different code is needed for IE8, adding to maintenance time The WebKit and Mozilla gradients allow for “stops” to be declared; this doesn’t seem to be possible with the IE gradient, limiting its flexibility IE’s filter doesn’t seem to have a way to declare “radial” gradients, which WebKit and Mozilla support For a gradient to be visible in IE, the element with the gradient must have layout

CSS / gradient, ie / by ThePeppersStudio (126 days, 13.46 hours ago)

Box Shadow

The Drawbacks The settings for the IE shadow filter do not match those of the other proprietary properties, so in order to make it look the same, you have to fiddle with the values until you get it right, which can cause maintenance headaches The filter property doesn’t validate, but neither do the WebKit and Mozilla properties, so this is a drawback in all browsers

CSS / ie, box, shadow, webkit, mozilla / by ThePeppersStudio (126 days, 13.50 hours ago)

Rounded Corners (border-radius)

The border-radius property (more commonly referred to as CSS3 rounded corners) is another popular CSS3 enhancement. This property has allowed developers to avoid the headache of bloated JavaScript or extra positioned elements to achieve the same effect. But once again, Microsoft doesn’t want to cooperate, so IE doesn’t have any support for this property. Fortunately, at least one person has come up with a very usable workaround that can be used in an IE-only stylesheet. Remiz Rahnas of HTML Remix has created an HTC file called CSS Curved Corner that can be downloaded off Google Code. The great thing about this piece of code is that it doesn’t require any extra maintenance if you adjust the amount of radius on your rounded corners. You just link to the file in your CSS, and the script will automatically parse your CSS to find the correct radius value from the standard border-radius property. The Drawbacks The HTC file is 142 lines (minifying or GZipping would help, but it’s still extra bloat) The behavior property will make your CSS invalid Your server needs to be able to load HTC files for this technique to work IE8 seems to have some trouble in some circumstances when the HTC file forces the curved element to have a negative z-index value

CSS / box, radius, corners, ie / by ThePeppersStudio (126 days, 13.53 hours ago)

Cross Browser Opacity

Includes ie8, ie5, ie6, ie7, netscape, safari, etc.

CSS / ie, safari, opacity, transparent / by ThePeppersStudio (311 days, 11.15 hours ago)

Cross Browser Hr Styling

Here’s a way to get cross-browser hr tags with some progressive-enhancement niceties. Note the use of page-break-after for printing purposes, as well as the line-height and margin to position the :after content (which are section symbols). you set both the color and background-color since different browsers render hrs differently. The goal here is to make the line look like a line of the color you intended, not necessarily to make it look exactly the same in all browsers. hr { background-color:#444; border-width:0; color:#444; height:2px; line-height:0; margin:-.5em 10px 1.8571em 10px; page-break-after:always; text-align:center; width:80%; } hr:after { content:"\a7\a7"; font-size:1.25em; }

CSS / hr, ie / by ThePeppersStudio (311 days, 11.19 hours ago)

HTML5 And IE Compatibility

XML/HTML / html5, ie, compatible, hack / by ThePeppersStudio (387 days, 10.46 hours ago)

Min-height for IE (and all other browsers)

Since min-height doesn't work in IE, this code makes up for IE's shortcomings. The first part of the code is the correct code that works in Firefox and Safari. The second part of the code is for IE. Internet Explorer will ignore min-height and is just given a height of 8em. The IE bug automatically expands the container to fit the extra text.

CSS / fix, ie, min-height / by ThePeppersStudio (425 days, 17.17 hours ago)