View Full Version : Activate code depending on browser problem

10-30-2006, 01:59 AM
Hi all

Hope the following make sence....

Im trying to execute a simple solution to the png transparancy problem in IE.

But in my attempt to get it to work in IE, it will not work in firefox or safari.

i found this solution for IE on the net in answer to a problem on a forum -

Hi Kevin,

This theory tends to work well for IE and non IE browsers. Below is the css
based on the background image of a DIV tag with ID png_background.

<style type="text/css">
body {

div#png_background {
width:344px; // specify width
height:215px; // specify height
background-image: url(ew.png);

<!--[if IE]>
div#png_background {
background-image: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=ew.png,sizingMethod='scale');


I couldnt get it to work ( if it works at all) as i didnt know how to implement the second part of the code as i didnt know where it went - whether html or css document (the <!--> part)

This is what i've done so far:
(relevant section in external css stylesheet)
div#grandwrapper {
background-image: none;
filter:progid: DXImageTransform.Microsoft.AlphaImageLoader(src=images/urban_background_repeat23.png,sizingMethod='scale');

#grandwrapper {
margin: 0 auto;


Im only versed in very basic css so im missing a lot of hack knowledge and how to implement them.

i also tried to apply a voice-family mechanism to get IE to pick up on the AlphaImage filter aka the 'holy hack' and to bypass it if its a non IE browser:
div#grandwrapper {
background-image: none;

* in the above, it SHOULD read progid and DXImage where appropriate and not icons.

but that didnt work.

The solution looks to me to be based on some kind of brower detection.

as stated before, im a beginner with css and i know practically no javascript - i can just about handle what ive done so far.

Im so stuck on this that its now become intolerable.

For the purposes of clarity, i have setup examples of it working in IE and firefox/safari (both using external css stylesheet method with the original and an altered duplicate stylesheet)

http://www.case236.co.uk/u_web.html (firefox/safari - [I]using my voice-family attempt)

http://www.case236.co.uk/u_web2.html (IE - extracted from borrowed code)

I started to attempt the A list apart 'object' based solution but that was too rich for my blood to handle.

Is there someone out there who can PLEASE PLEASE point me in the right direction in getting this to work.

I would be most greatful for any help recieved.

10-30-2006, 03:30 AM
now to make things worse, ive realised that my links now no longer work when including the div#grandwrapper code in my css file.