CSS HACKS

We have lots of ways to HACK CSS. However, these are the couple I find most useful.

Star-property Hack
*property: value;

Not sure on the name but I call this the star-property hack. This hack allows you to target IE7 and below.

Underscore-property Hack
_property: value;

This targets IE6 and below. Any styles will be applied to ie 6 and below.

!important Targetting

The !important at the end of a style, tells browsers that this property should override any other declarations of that property regardless of position. For example in this case:
width: 10px !important;
width: 80px;

Even though the 80px declaration comes second, Firefox 3 and IE7/8 will render this style as 10pixels. IE6 does not recognize the !important declaration and will apply an 80pixel width.

I prefer this method when I need to target IE7 and FF with one rule, and IE6 with the other. This is a valid method of feeding one rule to ie7/ff and another for ie6.

CSS Examples
div.test{
margin-top: 10px; //firefox
*margin-top: 15px; //ie7
}

div.test{
margin-top: 10px; //firefox
*margin-top: 5px; //ie7
_margin-top: 2px; //ie6
}

div.test{
margin-top: 10px !important; //ff and ie7
mragin-top: 2px; //ie6
}

NOTE: The star property hack and the underscore property hack are NOT valid css, but sometimes you need to get a little dirty to fix IE7 and IE6 issues. With the release of IE8, hopefully the inconsistencies of cross browser css will finally be ironed out, however people will still insist on using IE7...so knowing how to support it is important.

Hope you enjoyed with your hacked css.

contant reference  :  http://theinfiniteloopblog.com/tag/cross-browser-css/

Comments

Post a Comment

Popular posts from this blog

CSS Mouse Cursors and Custom Cursors

Image
<p style="color:red;"> <span style="cursor:crosshair;">crosshair cursor</span> <span style="cursor:wait;">wait cursor</span> <span style="cursor:help;">help cursor</span> </p> SS2.1 Cursor Styles auto The UA determines the cursor to display based on the current context. col-resize Indicates the item or column can be resized horizontally. crosshair A simple crosshair (e.g., short line segments resembling a "+" sign). default The platform-dependent default cursor. Often rendered as an arrow. help Help is available for the object under the cursor. Often rendered as a question mark or a balloon. move Indicates something is to be moved. not-allowed Indicates that the requested action will not be carried out. pointer The cursor is a pointer that indicates a link. row-resize Indicates the item or row can be resized vertically. text Indicates text that may be selected. Often rendered as an I-beam...
Read more

Block right click or disable keyboard on web pages

Hello frn'ds, Today i was searching some tricks about protecting web contents, during this i have found one interesting trick (i.e. html code) by which we can disabled the context menu in browser. This code not only block the right clicking in the browser , it also blocks the keyboard's key press events. body oncontextmenu="return false;" > Benefits of this code, 1. Can prevent View Source of your html page. 2. Can protect your page contents. 3. Can protect your web images and so on. click here to read more or know more
Read more

What is PAD file? "Submit your software with PAD file to Download.com"

Image
" Submit your software to Download websites with PAD file " Well, PAD (Portable Application Description) was the new word for me. When I have do some researched on it i have found that it is really very interesting thing for software developing companies or distributors. It is a simple XML file which contains descriptions about product (software). These descriptions are specified by software developer or software distributors. In general we can say descriptions are specified by software company or company owners or author like Software Name Company name Price type of software (free ware or shareware) Minimum System requirement Small description about software Download size contact and website addresses Screen shots, logos and icon and so on. Know More Actullly PAD maintain the standard in which it allows the software development companies to submit their software to software distribution companies in standard format. Due to this PAD saves time for both software developme...
Read more