Dragonfly CMS v9 ⇒ Themes v9 ⇒ css problem ⇒ Community Forums ⇒ CPG Dragonfly™ CMS
Forum IndexThemes v9

css problem Reply to topic


www.dizwebdesign.com/i...eme=hunter


left blocks, I have a container around the block code with special background properties color with transparent instead of using a transparent image. but for some reason all the content inside this container is showing transparent.

Any one got any ideas why or how to show the background at 50% transparent with out it affecting the content? I have not used this before so it is a new trick I guess lol. Thanks in advance for any help provided.

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
Multiple Setups


that's an easy one

opacity is inherited so each element (img, text, ecc ecc) should have opacity back to 1.

or set a child div with opacity 1 and background transparent ?

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
none available


Thanks I will try it and post results. Thanks

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
Multiple Setups


use: rgba(0-255,0-255,0-255,0 - 0.99)

background-color:#000; (fallback color for old browsers);
background-color:rgba(0,0,0,0.8); // black background with 80% of opacity.

rgba controls the color and allows an alpha channel, opacity makes the whole element and its content "transparent".

www.greenday2k.net

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):


I gave up on trying to do it with css for now i just using a 6px by 6px png 50% transparent. I will figure out how to do it with css eventaully but every way i have tried so far makes all content transparent to.
<div id="transback"> <div id="blockhead"> <div id="blockcontent"> </div> </div> </div>

That is the structure i had. the transback was the container i made the transparent background on but the 2 containers for blocks inherited it. there is some way to do it. I will ind it eventually.

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
Multiple Setups


.transback {background-color:rgba(0,0,0,0.5);}

www.greenday2k.net

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):


I will give it a shot. Thanks

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
Multiple Setups


greenday2k wrote
.transback {background-color:rgba(0,0,0,0.5);}


This does not work in IE Sad

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
Multiple Setups


.transback {
filter:alpha(opacity=50);
opacity:0.50;
}

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):


Thanks Gen, i have tried that as well that makes everything transparent content and all.

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
Multiple Setups


How did you go with InspectorClueNo's idea.

.:: I met php the 03 December 2003 :: Unforgettable day! ::.

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
CloudLinux / Apache 2.4 LSAPI / MySQLi 5.6 / PHP 5.6 / DCVS


Basically InspectorClueNo'd idea should work with the following classes:

.transback {opacity:0.5}
.blockhead, .blockcontent {opacity:1}

.:: I met php the 03 December 2003 :: Unforgettable day! ::.

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
CloudLinux / Apache 2.4 LSAPI / MySQLi 5.6 / PHP 5.6 / DCVS


I misunderstood what INspectorClue I will try it again. damn PEBCAC errors Smile

edit: nope still does not work all content insdie the transbg container still show up 50% transparent.

Just incase im doing some thing wrong heres the code

html<div class="blockcontainer"> <div class="blockhead" onclick="blockslide('{rightblock.S_BID}');" style="cursor:pointer;" title="{S_TOGGLE}"> {rightblock.S_TITLE} </div> <div class="blockcontent" id="pe{rightblock.S_BID}" {rightblock.S_VISIBLE}> {rightblock.S_CONTENT} </div> </div>

css.blockcontainer { background-color: #000000; opacity:0.5; alpha(opacity=50); -moz-opacity:0.5; } /* table inside the the td that holds the block title */ .blockhead { color: #FFF; font-size: 10px; font-weight: bold; height: 14px; width: 168px; padding: 3px; vertical-align: middle; border-bottom: 1px solid #000; opacity:1.0; alpha(opacity=100); -moz-opacity:1.0; } /* table that holds the content in blocks */ .blockcontent { width: 168px; padding: 3px; opacity:1.0; alpha(opacity=100); -moz-opacity:1.0; }

Live View: www.dizwebdesign.com/i...eme=hunter

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
Multiple Setups


add !important

opacity:1.0 !important;
alpha(opacity=100) !important;
--moz-opacity:1.0 !important;

www.greenday2k.net

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):


still no go all content is still transparent along with back ground, I dont think there is a way to do it in css.

Server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS):
Multiple Setups

All times are UTC


Jump to: