Hash Sign in Front of Property Name - CSS Browser Hack

Hash sign in front of property name - CSS browser hack?

Theorically is a hack for IE7:

But here you have a comprehensive list of browser which fails or pass that hack. IE is not in the list (neither in the list which pass or fails), but add other browsers to the fail list.

Purpose of asterisk before a CSS property

It is a browser specific CSS hack for versions 7 or below of Internet Explorer.

*property: value

Although Internet Explorer 7 corrected
its behavior when a property name is
prefixed with an underscore or a
hyphen, other non-alphanumeric
character prefixes are treated as they
were in IE6. Therefore, if you add a
non-alphanumeric character such as an
asterisk (*) immediately before a
property name, the property will be
applied in IE and not in other
browsers. Unlike with the hyphen and
underscore method, the CSS
specification makes no reservations
for the asterisk as a prefix, so use
of this hack could result in
unexpected behavior as the CSS
specifications evolve.

*property: value applies the property value in IE 7 and below. It may or may
not work in future versions. Warning:
this uses invalid CSS.

From: http://www.javascriptkit.com/dhtmltutors/csshacks3.shtml

Is there a way to set any style for a specific browser in CSS?

For example, if I want to set the corner radius in Webkit, Firefox and other than I can use the following CSS

No, that isn't how it works.

Vendor prefixed properties are used for experimental features. Either because the specification for the property hasn't been locked down or because the browser implementor knows their are problems with the implementation.

In general, you shouldn't use them in production code because they are experimental.

Support for the vendor prefixed versions is removed as support stabilises.

Is there a way to set any style for a specific browser in CSS?

There are several methods that have been used for that effect.

Parser bugs

By exploiting bugs or unsupported features in specific CSS engines (e.g. some versions of IE will ignore a * character on the front of a property name while other browsers will (correctly) discard the entire rule).

Conditional comments

Older versions of Internet Explorer supported an extended HTML comment syntax that could be used to add <link> or <style> elements specifically for certain versions of IE.

Support for this has been dropped.

JavaScript

Classes can be added to elements (typically the body element) using JavaScript after doing browser detection in JS.

Is it possible to apply CSS selectively depending on the browser being used?

<!--[if lt IE 7 ]> <body class="ie6"> <![endif]-->
<!--[if IE 7 ]>    <body class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <body class="ie8"> <![endif]-->
<!--[if IE 9 ]>    <body class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <body> <!--<![endif]-->

The above targets specific instances of IE since a bug might be version specific.

When creating your rule for IE6 and IE7 for example use

body.ie6 wrapper{background-color:#0000ff;}
body.ie7 wrapper{background-color:#00ff00;}

Should I remove asterisk from CSS if site doesn't work in IE8

The code you're showing isn't the sole reason why your site doesn't work. That's just a media query - it says "for any print media (@media print {), for every element (*), use these styles" .But IE8 and lower can't read media queries, so they will ignore any styles inside a media query.

You could replace the * with specific selectors for all the elements that you want. But, since IE8- can't read media queries, it won't change how IE8- print your site.

You may want to consider something like Modernizr or the HTML5shiv to help older versions of work with newer code. But every site is different.

What does an underscore _ mean in CSS?

This is an old CSS-Hack for IE5, 5.5 & 6.

All browser will display the position:fixed while IE5 - 6 use the _position, so it display it absolute.

But note: This CSS won't validate! And it won't work for IE5/MAC

How to make CSS visible only for Opera

This hack works for the latest Opera:

 @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
       #id {css rule}
 }

It doesn't touch any other browser as far as i tested, but this may be actual for several months, with web technologies boom etc.

How to prevent a browser from storing passwords

Thank you for giving a reply to me. I followed the below link

Disable browser 'Save Password' functionality

I resolved the issue by just adding readonly & onfocus="this.removeAttribute('readonly');" attributes besides autocomplete="off" to the inputs as shown below.

<input type="text" name="UserName" autocomplete="off" readonly 
onfocus="this.removeAttribute('readonly');" >

<input type="password" name="Password" autocomplete="off" readonly 
onfocus="this.removeAttribute('readonly');" >

This is working fine for me.

Hash Sign in Front of Property Name - CSS Browser Hack