Jump to content

Help me on opacity...


terryds

Recommended Posts

Hello, everyone... I have set the opacity of my headerwrap (the red one) to 0.7, then automatically, my topwrap (the black one) also gets transparent... Look at this : rgy069.png This is my code : CSS

 body {margin: 0px;padding: 0px;background: url(files/batthern.png) #FF6600;} .headerwrap {height: 673px;background-image: -webkit-linear-gradient(top, #990000, #FF0033);background-color: red;padding: 0px;opacity: 0.7;} .headerwrap:hover {opacity: 1;} .topbar {height: 35px;background-color: black;opacity:1;}

HTML

<!DOCTYPE html><html><head><link rel="stylesheet" type="text/css" href="style.css"><title>My WebPage</title></head><body><div class="headerwrap"><div class="topbar"></div></div></body></html>

Can you please me give the solutions so i can make the headerwrap get transparent but the topwrap wont.. ?Thank Sorry for bad English

Edited by terryds
Link to comment
Share on other sites

  • 3 weeks later...

You should not set any opacity to the topbar in the css code. .topbar{height:35px;background-color:black;}Do not set any opacity for this.

Link to comment
Share on other sites

opacity applies to the element and everything that's inside it. If you don't want the opacity to affect the topbar element, take the topbar element out of the headerwrap element.

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...