Forums
View unanswered posts | View active topics It is currently Thu Jul 31, 2014 1:26 am



Reply to topic  [ 7 posts ] 
 Opacity disappears when using border radius. 
Author Message

Joined: Thu Sep 19, 2013 4:24 am
Posts: 2
Post Opacity disappears when using border radius.
This works:

Code:
.somestyle {
  -moz-opacity: 0.75;
  opacity:0.75;
  filter:alpha(opacity=75); /* For IE8 and earlier */
  border-radius: 10px;
}


although it (obviously) does not show rounded corners on IE8 and earlier.

But as soon as I add CSS3PIE:

Code:
.somestyle {
  -moz-opacity: 0.75;
  opacity:0.75;
  filter:alpha(opacity=75); /* For IE8 and earlier */
  border-radius: 10px;
  behavior: url(PIE.htc);
}


opacity is set to 100%. I do get rounded corners. I've tried both v1.0.0 and v2.0-beta with the same results. Oddly enough I can distinctly remember it used to work. So I'm not sure what changed.


Thu Sep 19, 2013 4:29 am
Profile

Joined: Thu Apr 07, 2011 3:23 am
Posts: 73
Post Re: Opacity disappears when using border radius.
You should try border-radius + rgba background, instead of border-radius + opacity.

background: rgba(0,0,0,0.5) is similar to background: #000 + opacity: 50%.


Wed Sep 25, 2013 7:22 am
Profile

Joined: Thu Sep 19, 2013 4:24 am
Posts: 2
Post Re: Opacity disappears when using border radius.
Yes, but I want the entire container to become semi-transparent, not the background only.


Fri Sep 27, 2013 4:47 am
Profile

Joined: Wed Jul 14, 2010 11:46 am
Posts: 1441
Post Re: Opacity disappears when using border radius.
https://github.com/lojjic/PIE/issues/46

Unfortunately I don't see a way to do this accurately, so I don't expect it will ever work.


Sat Sep 28, 2013 9:51 pm
Profile

Joined: Thu Apr 07, 2011 3:23 am
Posts: 73
Post Re: Opacity disappears when using border radius.
Why not using rgba for your backgrounds + opacity for your content?

Code:
<div class=somestyle>       <-- container, gets rgba background
  <div class=inner>         <-- inner div with no background, gets opacity
    blabla                  <-- content to opacify
  </div>
</div>


Thu Oct 03, 2013 2:21 am
Profile

Joined: Tue Dec 03, 2013 9:53 am
Posts: 1
Post Re: Opacity disappears when using border radius.
rgba cannot be used because IE8 does not support rgba.

Is there a way to add opacity in IE8 with css3pie?

Much appreciated, thanks.


Tue Dec 03, 2013 9:56 am
Profile

Joined: Thu Apr 07, 2011 3:23 am
Posts: 73
Post Re: Opacity disappears when using border radius.
Yes, you can use rgba background on IE<9 with CSS3Pie.
Just do that in the "parent" div, and put your opacity in your "child" div


Mon Dec 09, 2013 8:06 am
Profile
Display posts from previous:  Sort by  
Reply to topic   [ 7 posts ] 

Who is online

Users browsing this forum: No registered users and 3 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group.
Designed by STSoftware for PTF.