CSS Stylesheet: opacity

[Thomasmorel]

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?

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;

[wolfcry911]

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.

[Thomasmorel]

Thx. Yeah, i know, but i don’t know where to put the image. I’m not really familiar with php

[chrisburton]

PHP?

background: rgba(17,17,17,.5) url(path/to/image.png) center no-repeat;

edit: My fault. I misread the above conversation.

[Anonymous]

If you want the image stretched to fit the resolution of the browser, I suggest taking a look at: http://srobbin.com/jquery-plugins/jquery-backstretch/

[Author]

Posts