IE hack for CSS padding property

It is very frustrating sometimes when we do everything right and by the book but still our page will look different in one browser and totally different in another. Here is a very simple hack to implement your CSS padding property perfect in all the versions of Internet Explorer.
Say you have an image or a text that is being displayed with 10 pixels top-padding on your page. It looks fine on other browsers but wouldn’t implement properly in IE7 (or some other versions of IE). It is also known as double padding problem because your IE displays double padding than originally implemented. To remove that fault you can write your css properties as follows:

      padding-top: 10px;
     *padding-top: 10px; // Read by IE7 and earlier versions
     _padding-top: 10px; // Read by IE6 and earlier versions

Properties prefixed by asterisk (*) will be read by IE7 and earlier versions; prefixed by underscore will be read by IE6 and earlier versions and your padding will be implemented perfectly.
Before using IE hacks it is advisable to make sure that you are not making any mistakes in your coding. If everything is working alright and coded perfectly and still you don’t get desired output, then only go for hacks.

Happy coding. 🙂

Posted in CSS. Tags: . 1 Comment »

One Response to “IE hack for CSS padding property”

  1. vips Says:

    thanks to post this article but I want padding css hack for ie8 & 9.

Speak Your Mind

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: