[Webkit-unassigned] [Bug 120175] New: [transform-style:preserve-3d] Child element is flattened after changing the value of overflow other than visible and/or the opacity value other than 1.

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Thu Aug 22 15:24:51 PDT 2013


https://bugs.webkit.org/show_bug.cgi?id=120175

           Summary: [transform-style:preserve-3d]  Child element is
                    flattened after changing the value of overflow other
                    than visible and/or the opacity value other than 1.
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: All
        OS/Version: Mac OS X 10.8
            Status: UNCONFIRMED
          Severity: Normal
          Priority: P2
         Component: CSS
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: jaslong at google.com


I created a child div inside the parent div and rotate the child div using 3D rotate tool.  Then go back to the parent div level and position the center point of the 3D rotate tool on the parent div.  The result is that the child div is flattened as soon as the center point of the 3D tool is positioned.

.div-vhpw {
        position: absolute;
        width: 172px;
        height: 141px;
        left: 58px;
        top: 28px;
        background-image: none;
        background-color: rgb(139, 255, 116);
        -webkit-transform-origin: -21px 179px 0px;
        -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
      }
.div-ii2m {
        position: absolute;
        width: 133px;
        height: 134px;
        left: 74.99999999999994px;
        top: 71px;
        background-image: none;
        background-color: rgb(0, 104, 204);
        -webkit-transform: matrix3d(0.7660444431, 0, 0.6427876097, 0, -0.4545194777, 0.7071067812, 0.5416752204, 0, -0.4545194777, -0.7071067812, 0.5416752204, 0, 0, 0, 0, 1);
        -webkit-transform-style: preserve-3d;


Also happens after changing the opacity on the parent div
.div-5s13 {
        position: absolute;
        width: 164px;
        height: 155px;
        left: 49px;
        top: 20px;
        background-image: none;
        background-color: rgb(209, 255, 221);
        opacity: 0.99;
      }
.div-rrj0 {
        position: absolute;
        width: 165px;
        height: 132px;
        left: 51.99999999999997px;
        top: 62px;
        background-image: none;
        background-color: rgb(217, 23, 255);
        -webkit-transform-origin: 0px 132px 0px;
        -webkit-transform: matrix3d(0.4924235601, 0, 0.8703556959, 0, -0.5594538574, 0.7660444431, 0.3165237632, 0, -0.6667311444, -0.6427876097, 0.3772183319, 0, 0, 0, 0, 1);
        -webkit-transform-style: preserve-3d;

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.



More information about the webkit-unassigned mailing list