Forums
View unanswered posts | View active topics It is currently Fri Oct 31, 2014 7:37 am



Reply to topic  [ 4 posts ] 
 overflow:auto; 
Author Message

Joined: Wed Nov 03, 2010 5:51 am
Posts: 3
Post overflow:auto;
First off, I'm loving PIE.
Really great work, and it's making the anxiety of waiting for CSS3 to become ubiquitous less painful.
Thanks.

Anyway, I’ve run into an issue and I’m wondering if there’s a known solution to it.
I’ve searched this forum, and gone through the known issues but can’t find reference to it.

Here’s the problem:
I have a container div with the overflow set to auto.
Within that div I have more divs which use PIE’s border radius, drop shadow and gradient.

Initially all appears to be ok. But when I scroll the container div the content of the inner divs is no longer aligned with the PIE styles, and it all falls to pieces.
I’ve given the container relative positioning and a z-index of 0 which fixed an earlier issue I was having, but in doing so caused this.


Code:

.divMessagingContainer
        {
            border:1px solid #e4e4e4;
            width:600px;
            height:400px;
            overflow:scroll;
            z-index:0;
            position:relative;
        }
       
        .divMessagingContainer .divBubbleLeft
        {
            width:400px;
            border:1px solid #CCC;

            float:left;
            clear:both;
            margin:10px;
            z-index:9999;
           
           
           
            -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
            border-radius: 10px;
           
            -moz-box-shadow: 0px 0px 10px #d2d2d2;
   -webkit-box-shadow: 0px 0px 10px #d2d2d2;
   box-shadow: 0px 0px 10px #d2d2d2;
      
   background: -webkit-gradient(linear, 0 0, 0 bottom, from(#fefefe), to(#eaeaea));
   background: -moz-linear-gradient(#fefefe, #eaeaea);
   -pie-background: linear-gradient(#fefefe, #eaeaea);
         
         
         
   behavior: url(PIE.htc);
        }



Cheers


Wed Nov 03, 2010 9:20 am
Profile

Joined: Wed Nov 03, 2010 5:51 am
Posts: 3
Post Re: overflow:auto;
Hi, anyone got any suggestions on this issue?

Beta 3 seems like yet another big leap forward, but doesn't resolve this problem.

thanks


Tue Dec 14, 2010 7:38 am
Profile

Joined: Wed Jul 14, 2010 11:46 am
Posts: 1446
Post Re: overflow:auto;
IE is buggy in general with absolutely-positioned elements within scrollable containers, so unfortunately PIE runs into those bugs. You might try adding a wrapper div with position:relative immediately inside the .divMessageContainer -- that way, PIE's element is always relative to that wrapper div rather than the scrollable one.


Tue Dec 14, 2010 9:53 am
Profile

Joined: Wed Nov 03, 2010 5:51 am
Posts: 3
Post Re: overflow:auto;
Good call, I'll give it a go.

Thanks very much


Wed Dec 15, 2010 10:46 am
Profile
Display posts from previous:  Sort by  
Reply to topic   [ 4 posts ] 

Who is online

Users browsing this forum: Exabot [Bot], Yahoo [Bot] and 5 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:  
cron
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group.
Designed by STSoftware for PTF.