Anyone Can Code

Not everyone is a coder, but a coder can come from anywhere

Archive for the ‘CSS’ Category

All about CSS

Opacity doesn’t work in IE

Posted by jhalak on October 8, 2008

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')
}

Posted in CSS | Leave a Comment »

Transperant png doesn’t show in IE.

Posted by jhalak on September 19, 2008

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.

Posted in CSS | Tagged: , | 1 Comment »

overflow doesn’t work on opera

Posted by jhalak on May 12, 2008

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.

Posted in CSS | Leave a Comment »