Hi David,
>> How, without using conditional comments at all, do I target IE 6,7, and 8
> I was asking how I'd be able to target all three *without* any CCs.
Add an extra script line?
<script type="text/javascript">/*<![CDATA[*/var
isIE=/*...@cc_on!@*/false;document.documentElement.className+="
isIE";/*]]>*/</script>
Not perfect but adequate for most cases.
>> .gradientBg {...
> Sorry, mate. That won't work. All IEs will get the solid background with the
> filter "image" on top. Not what you'd want at all... :(
I'll admit that snippet was untested but you can see a working example here:
http://websemantics.co.uk/online_tools/image_to_data_uri_convertor/
The "Browse" and "Convert image" are pure CSS.
Background gradients appear to work fine in IE6+, Firefox and Safari.
Untested in Opera though so please tell me if the button doesn't degrade well.
I considered the methods too clunky for use in production though.
Regards
Mike Foskett
http://websemantics.co.uk/
-----Original Message-----
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On
Behalf Of David Hucklesby
Sent: 29 October 2010 16:51
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] A simple IE and JS detection method?
On 10/29/10 2:13 AM, Foskett, Mike wrote:
[...]
> David,
>
>> How, without using conditional comments at all, do I target IE 6,7,
>> and 8
>
> From the example:
>
> bg {background: #fff}
>
> .IE6 bg,
>
> .IE7 bg { filter: progid: etc...}
>
> .IE8 bg { -ms-filter:" progid: etc"}
>
Precisely. I was asking how I'd be able to target all three *without*
any CCs.
> Though I personally for what you're asking I'd do it in one style
> rule like this:
>
> .gradientBg {
>
> background:#f1f0f3;
>
> background-image: -webkit-gradient(linear, left top, left bottom,
> color-stop(0, #f8f7fa), color-stop(1, #cfcbd8));
>
> background-image: -moz-linear-gradient(rgba(248,247,250, 1) 0%,
> rgba(207,203,216, 1) 100%);
>
> filter:
> progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFf8f7fa,
> endColorstr=#FFcfcbd8);
>
> -ms-filter:"
> progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFf8f7fa,
> endColorstr=#FFcfcbd8))";
>
> }
>
> Covers everything you ask plus Firefox, Safari and IE8+.
>
Sorry, mate. That won't work. All IEs will get the solid background with
the filter "image" on top. Not what you'd want at all... :(
(FWIW - I actually tried this.)
And what about my browser of choice, Opera. Not popular in the US or UK,
I know, but has an equal presence with Safari and Chrome in Europe, an
even bigger presence in other parts of the world, and a major browser on
small devices like phones. RGBa() has my money...
Cordially,
David
--
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*******************************************************************
This is a confidential email. Tesco may monitor and record all emails. The
views expressed in this email are those of the sender and not Tesco.
Tesco Stores Limited
Company Number: 519500
Registered in England
Registered Office: Tesco House, Delamare Road, Cheshunt, Hertfordshire EN8 9SL
VAT Registration Number: GB 220 4302 31
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*******************************************************************
