Is there a way to make a div image transparent while the text in the div is not. here is my current code.

.body {
	
	width: 800px;
	height: auto;
	font-family: Arial;
	font-size: 11px;
	color: #000;
	background: url('Images/backg3.png');
	opacity: 0.5;
	alpha(opacity=50);
}


.textbody {
	padding: 10px;
	color: #000000;
	font-weight: bold;
	filter:alpha(opacity=100);
	
}
.textbody h1 {
	float: left;
}

.textbody p{
	font-size: 15px;
	
	
}
.textbody img{
	padding: 5px;
}

Thanks for any help.

Recommended Answers

All 6 Replies

You can either use a .png background image image (so the text is still solid) or css3. Cross browser compatibility issues with both, unfortunately.

I have done it before, I just can't remember how. could you give me an example with the second one though?

Could you please tell me which are your target browser. I beleive that you can do it by CSS for Mozilla and IE, there is some syntax different, but you can put both enteries for IE and FF in CSS class and it would be automatically picked by the running browser.

I was hoping to make it as browser friendly as possible, but I guess the main ones would be IE, Firefox and chrome.

I tried that and it did not work. any other ideas?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.