Korean Fashion Online - |
 |
| Latest Korean dresses, Korean accessories A Community website on Korean people lifestyle and their fashions. Design and developments were approximately done in 20 days. Site contains an Oscommerce shopping cart, Galleries, Also albums of different Korean actors and actresses, A forum for different discussions on Korean Fashion trends. |
Ran into a problem today that I really should have forseen: as usual I coded a site so it all
lines up perfectly in Mozilla and IE6, flip over to IE7 and it’s all out of whack. I realized the reason right away: in terms of calculating borders, IE added the border pixel inside the div. Unlike mozilla which added the border outside of the div 
Here is the corresponding HTML:
<div class="test">Only !important Tag
which will display border in IE6 as well as in Mozilla
but not in IE7
</div>
Here is what my CSS looks like:
.test {
width: 200px;
height: 200px;
background:#000000;
border:1px dashed #000000 !important;
border:1px dashed #ffffff;
color:#FFFFFF;
}
This will solve issue in IE6 and Mozilla but not in IE7
I’ve used !important to override the bordercolor property previously set. The :LANG Selector is not supported by IE7 and therefore all versions of internet explorer will not read these styles.
Now I begin by adding a lang attribute to my body element:
<body lang="en">
Here is the corresponding HTML:
<div class="item">
The :LANG Selector is use which is not supported in IE7
</div>
Now, add the CSS to target our div element and start filtering out browsers:
.item {
width: 200px;
height: 200px;
background:#000000;
border:1px dashed #000000;
color:#FFFFFF;
}
*:lang(en) .item{
border:1px dashed #ffffff;!important
}
I’ve used !important to override the bordercolor property previously set. The :lang selector is not supported by IE7 and therfore all versions of Internet Explorer will not read these styles.
Only !important Tag
View the IE7 css hack test page to try it out in your browser.