I'm building my website in wordpress. I want to transparent the background for 50%. When I type down the code in css, it's making the background fully transparent. What am i doing wrong?
It's not giving you a background at all - because it's throwing an error (a simple validation would show you). The opacity property should be separate from the background (ie place a semi-colon after background value).
Note however, that using opacity will affect not only the background but everything in #navi as well (text, etc). To accomplish your goal use an rgba or hsla value for the background property.
You need to change background: #111111 opacity: 0.5; to background: rgba(17,17,17,0.5); I recommend making the background a semi-transparent png image for a fallback for browsers that don't support RGBa/HSLa.
This is the code:
#navi {
float: left;
background: #111111 opacity: 0.5;
width: 550px;
height: 40px;
font-family: Menlo;
font-size: 1.2em;
padding: 0;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
Note however, that using opacity will affect not only the background but everything in #navi as well (text, etc). To accomplish your goal use an rgba or hsla value for the background property.
background: #111111 opacity: 0.5;to
background: rgba(17,17,17,0.5);I recommend making the background a semi-transparent png image for a fallback for browsers that don't support RGBa/HSLa.
edit: My fault. I misread the above conversation.