?
Solved

CSS, opacity..

Posted on 2014-07-13
3
Medium Priority
?
260 Views
Last Modified: 2014-07-13
I have div1 and div2.

div1 is set to opacity: 0.6;

Question: How can get rid of the opacity at .div2 p{...}?

Can I somehow cancle the opacity set at div1?

Thank you.
<div class="div1">

     <div class="div2">
          <p>
                 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed dia...
         </p>
    </div>

</div>

CSS:
.div1 {
	background-color: black;
	opacity: 0.6;
	height: 200px;
}

.div2{
	padding-top:60px; 
	padding-left: 30px;
	padding-right: 30px;
}

.div2 p{
	margin-top:0px;
	background-color: black;
	opacity: 1.0;
	border-radius: 5px;
	color: red;
	padding-top: 10px;
	padding-left: 10px;
	padding-bottom:10px;
	padding-right:10px;
}

Open in new window

0
Comment
Question by:Mike Eghtebas
  • 2
3 Comments
 
LVL 54

Accepted Solution

by:
Scott Fell,  EE MVE earned 2000 total points
ID: 40193420
http://jsbin.com/rarej/1/edit?html,css,output
.div1 {
	background-color: rgba(0,0,0,.6);
	/*opacity: 0.6;*/
	height: 200px;
}

.div2{
	padding-top:60px; 
	padding-left: 30px;
	padding-right: 30px;
}

.div2 p{
	margin-top:0px;
	background-color: black;
	opacity: 1.0;
	border-radius: 5px;
	color: red;
	padding-top: 10px;
	padding-left: 10px;
	padding-bottom:10px;
	padding-right:10px;
}

Open in new window

0
 
LVL 34

Author Closing Comment

by:Mike Eghtebas
ID: 40193430
Thank you, Solution is perfect.

How long this links remains active?

Mike
0
 
LVL 54

Expert Comment

by:Scott Fell, EE MVE
ID: 40193623
I don't control jsbin so it is up to them.  I don't believe they ever come down but wouldn't rely on it.  The links to experts-exchange should always be good.
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
Originally, this post was published on Monitis Blog, you can check it here . Websites are getting bigger and more complicated by the day. Video, images and custom fonts are all great for showcasing your product or service. But the price to pay in…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Suggested Courses

864 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question