Archive for category CSS

Opacity doesn’t work in IE

opacity attribute of CSS doesn’t work for IE. if there is a class difined as:

.myclass{
opacity: 0.5;
}

then it will work all browser other than IE. To make this class functional in IE also you have to add:

.myclass{
opacity: 0.5;
filter: Alpha(opacity='50')
}

Leave a Comment

Transperant png doesn’t show in IE.

In many cases we need to use transparent png image as background. But in IE, png files don’t show as transparent. To fix this problem follow the following procedure:

1) Say, the div in which u want ti use transparent image has a class named “trans_bg_class”. The class is defined as:

.trans_bg_class{
height:50px;
width:100px
background:url(images/transparent_image.png) repeat;
}

2) Now add another class named “trans_bg_class_IE”

.trans_bg_class_IE{
height:50px;
width:100px
filter: progid : DXImageTransform.Microsoft.AlphaImageLoader(src='../images/transparency_page.png', sizingMethod='scale');
}

3) Create a javascript file named “transbgIEfix.js” and write the following code in it:

var arVersion = navigator.appVersion.split("MSIE")
var version = parseFloat(arVersion[1])

if ((version >= 5.5) && (document.body.filters)){
var x = document.getElementsByTagName('div');
for (var i=0;i<x.length;i++)
{
if (x[i].className == 'trans_bg_class'){
x[i].setAttribute('className', 'trans_bg_class_IE');
}
}
}

4)  Now add the javascript file in the head section of your HTML page as below:

<!--[if lt IE 7.]>
<script defer type="text/javascript" src="transbgIEfix.js"></script>
<![endif]-->

That is all. Now browse the page with IE and you will see the div with transperent image.

,

1 Comment

overflow doesn’t work on opera

If in CSS “overflow-x” or “overflow-y” is defined then it will work on all
browsers except opera. So the solution is to declare “overflow” only and
the width and height of the container should be actual width and height at
yiur desire so that the overflow works according to your demand.

Leave a Comment

Follow

Get every new post delivered to your Inbox.