View Full Version : How to make this div transparant?

12-18-2003, 10:45 AM
In the HTML below I would like to make the red backgroundcolor transparant for example for 60%. Can someone help me how to do this?

This is the HTML:

<style type="text/css">
div {
border-top: 1px solid orange;
border-bottom: 1px solid orange;
border-right: 1px solid orange;
border-left: 1px solid orange;
width: 50%;
background-color: #ff0000;
How can I make this red background-color transparant for example for 60%?



12-18-2003, 02:07 PM
you might want to try playing around with this:


plus this is a CSS question and not JS....

12-18-2003, 02:31 PM
Thanks for your help. Sorry I didn't know about the forum. But the problem with your code "filter:alpha(opacity=60);" is that the text on the background becomes also transparent and that's what I would like to avoid. So I would like to have the background transparent but not the text in it. Still any hope?


12-18-2003, 03:03 PM
Just guessing here... <h1 filter:alpha(opacity=60);.... or something like that, might change the opacity just for the text of heading 1...

12-18-2003, 11:16 PM
<div style="position:relative;width:50%;height:40%">
<div style="position:absolute;left:0;top:0;width:100%;height:100%;background-color:red;filter:alpha(opacity=60);-moz-opacity:0.6"></div>
<div style="position:absolute;left:0;top:0;width:100%;height:100%;padding:10;font-size:12px;">

This text is solid on a transparent background


12-19-2003, 10:25 AM
plus this is a CSS question and not JS....

Oh, but it might be a JS one :D if using styles on-the-fly.

By the way, knows anyone which is the on-the-fly attribute correspondent with CSS alpha(opacity=) and -moz-opacity:

document.getElementById(id).style.filter = 'alpha(opacity=60)';
document.getElementById(id).style.mozOpacity = '0.6';


EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum