Bug 733849 Comment 17 Edit History

Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.

Original comment by
on 
So looks like `preserve-3d` on `<table>` or `<div style="display: table;"></div>` doesn't take effect.

[`mTransformStyle` of `nsTableWrapperFrame` is always `flat`](https://searchfox.org/mozilla-central/rev/253125d1947acbc3033b7b2e3a9a0d1bf4358a2d/layout/generic/nsIFrame.cpp#1769) even if we set `transform-style: preserve-3d`.

e.g. we can simplify the test case to something like this:
```
<style>
#outer {
  transform-style: preserve-3d;
  transform: rotateY(30deg);
  display: table;
}
#target {
  width: 100px;
  height: 100px;
  background: green;
  border-radius: 50% 50% 0 0;
  transform: rotateX(30deg);
}
</style>
<div id=outer>
  <div id=target></div>
</div>
```
And Gecko doesn't render `target` and `outer` in the same 3D space.

I tried to hack this function to make it always return true, but the elements inside the table disappears. :(
Revision 1 by
on 
So looks like `preserve-3d` on `<table>` or `<div style="display: table;"></div>` doesn't take effect.

[`mTransformStyle` of `nsTableWrapperFrame` is always `flat`](https://searchfox.org/mozilla-central/rev/253125d1947acbc3033b7b2e3a9a0d1bf4358a2d/layout/generic/nsIFrame.cpp#1769) even if we set `transform-style: preserve-3d`.

e.g. we can simplify the test case to something like this:
```
<style>
#outer {
  transform-style: preserve-3d;
  transform: rotateY(30deg);
  display: table;
}
#target {
  width: 100px;
  height: 100px;
  background: green;
  border-radius: 50% 50% 0 0;
  transform: rotateX(30deg);
}
</style>
<div id=outer>
  <div id=target></div>
</div>
```
And Gecko doesn't render `target` and `outer` on the same 3D space.

I tried to hack this function to make it always return true, but the elements inside the table disappears. :(
Revision 2 by
on 
So looks like `preserve-3d` on `<table>` or `<div style="display: table;"></div>` doesn't take effect.

[`mTransformStyle` of `nsTableWrapperFrame` is always `flat`](https://searchfox.org/mozilla-central/rev/253125d1947acbc3033b7b2e3a9a0d1bf4358a2d/layout/generic/nsIFrame.cpp#1769) even if we set `transform-style: preserve-3d`.

e.g. we can simplify the test case to something like this:
```
<style>
#outer {
  transform-style: preserve-3d;
  transform: rotateY(30deg);
  display: table;
}
#target {
  width: 100px;
  height: 100px;
  background: green;
  border-radius: 50% 50% 0 0;
  transform: rotateX(30deg);
}
</style>
<div id=outer>
  <div id=target></div>
</div>
```
And Gecko doesn't render `target` and `outer` in the same 3D space.

I tried to hack this function to make it always return true, but the elements inside the table disappears. :(
Revision 3 by
on 
So looks like `preserve-3d` on `<table>` or `<div style="display: table;"></div>` doesn't take effect.

[`mTransformStyle` of `nsTableWrapperFrame` is always `flat`](https://searchfox.org/mozilla-central/rev/253125d1947acbc3033b7b2e3a9a0d1bf4358a2d/layout/generic/nsIFrame.cpp#1769) even if we set `transform-style: preserve-3d`.

e.g. we can simplify these failed test cases to this one:
```
<style>
#outer {
  transform-style: preserve-3d;
  transform: rotateY(30deg);
  display: table;
}
#target {
  width: 100px;
  height: 100px;
  background: green;
  transform: rotateX(30deg);
}
</style>
<div id=outer>
  <div id=target></div>
</div>
```
And Gecko doesn't render `target` and `outer` in the same 3D space.

I tried to hack this function to make it always return true, but the elements inside the table disappears. :(
Revision 4 by
on 
So looks like `preserve-3d` on `<table>` or `<div style="display: table;"></div>` doesn't take effect.

[`mTransformStyle` of `nsTableWrapperFrame` is always `flat`](https://searchfox.org/mozilla-central/rev/253125d1947acbc3033b7b2e3a9a0d1bf4358a2d/layout/generic/nsIFrame.cpp#1769) even if we set `transform-style: preserve-3d`.

e.g. we can simplify these failed test cases to this one:
```
<style>
#outer {
  transform-style: preserve-3d;
  transform: rotateY(30deg);
  display: table;
}
#target {
  width: 100px;
  height: 100px;
  background: green;
  transform: rotateX(30deg);
}
</style>
<div id=outer>
  <div id=target></div>
</div>
```
And Gecko doesn't render `target` and `outer` in the same 3D space.

I tried to hack this function to make it always return true, but the elements inside the table disappears. :( (It's bug 1560704)
Revision 5 by
on 
So looks like `preserve-3d` on `<table>` or `<div style="display: table;"></div>` doesn't take effect.

[`mTransformStyle` of `nsTableWrapperFrame` is always `flat`](https://searchfox.org/mozilla-central/rev/253125d1947acbc3033b7b2e3a9a0d1bf4358a2d/layout/generic/nsIFrame.cpp#1769) even if we set `transform-style: preserve-3d` to table element.

e.g. we can simplify these failed test cases to this one:
```
<style>
#outer {
  transform-style: preserve-3d;
  transform: rotateY(30deg);
  display: table;
}
#target {
  width: 100px;
  height: 100px;
  background: green;
  transform: rotateX(30deg);
}
</style>
<div id=outer>
  <div id=target></div>
</div>
```
And Gecko doesn't render `target` and `outer` in the same 3D space.

I tried to hack this function to make it always return true, but the elements inside the table disappears. :( (It's bug 1560704)
Revision 6 by
on 
So looks like `preserve-3d` on `<table>` or `<div style="display: table;"></div>` doesn't take effect.

[`mTransformStyle` of `nsTableWrapperFrame` is always `flat`](https://searchfox.org/mozilla-central/rev/253125d1947acbc3033b7b2e3a9a0d1bf4358a2d/layout/generic/nsIFrame.cpp#1769) even if we set `transform-style: preserve-3d` to table element.

e.g. we can simplify these failed test cases to this one:
```
<style>
#outer {
  transform-style: preserve-3d;
  transform: rotateY(30deg);
  display: table;
}
#target {
  width: 100px;
  height: 100px;
  background: green;
  transform: rotateX(30deg);
}
</style>
<div id=outer>
  <div id=target></div>
</div>
```
And Gecko doesn't render `target` and `outer` in the same 3D space.

I tried to hack `nsIFrame::Extend3DContext()` to make it always return true for `nsTableWrapperFrame`, but the elements inside the table disappears. :( (It's bug 1560704)
Revision 7 by
on 
So looks like `preserve-3d` on `<table>` or `<div style="display: table;"></div>` doesn't take effect.

[`mTransformStyle` of `nsTableWrapperFrame` is always `flat`](https://searchfox.org/mozilla-central/rev/253125d1947acbc3033b7b2e3a9a0d1bf4358a2d/layout/generic/nsIFrame.cpp#1769) even if we set `transform-style: preserve-3d` to table element.

e.g. we can simplify these failed test cases to this one:
```
<style>
#outer {
  transform-style: preserve-3d;
  transform: rotateY(30deg);
  display: table;
}
#target {
  width: 100px;
  height: 100px;
  background: green;
  transform: rotateX(30deg);
}
</style>
<div id=outer>
  <div id=target></div>
</div>
```
And Gecko doesn't render `target` and `outer` in the same 3D space.

I tried to hack `nsIFrame::Extend3DContext()` to make it always return true for `nsTableWrapperFrame`, but the elements inside the table disappears. :( (It's bug 1560704)

Note: I think we failed the test which uses `display: table-cell` in css/css-transforms/transform-table-011.html may be another bug. That happens when using `rotateX(90)` in the outer div. (If we change it to other values, e.g. 80deg or 100deg, our behavior is the same as Blink.)
Revision 8 by
on 
So looks like `preserve-3d` on `<table>` or `<div style="display: table;"></div>` doesn't take effect.

[`mTransformStyle` of `nsTableWrapperFrame` is always `flat`](https://searchfox.org/mozilla-central/rev/253125d1947acbc3033b7b2e3a9a0d1bf4358a2d/layout/generic/nsIFrame.cpp#1769) even if we set `transform-style: preserve-3d` to table element.

e.g. we can simplify these failed test cases to this one:
```
<style>
#outer {
  transform-style: preserve-3d;
  transform: rotateY(30deg);
  display: table;
}
#target {
  width: 100px;
  height: 100px;
  background: green;
  transform: rotateX(30deg);
}
</style>
<div id=outer>
  <div id=target></div>
</div>
```
And Gecko doesn't render `target` and `outer` in the same 3D space.

I tried to hack `nsIFrame::Extend3DContext()` to make it always return true for `nsTableWrapperFrame`, but the elements inside the table disappears. :( (It's bug 1560704)

Note: The reason that we failed the test which uses `display: table-cell` in css/css-transforms/transform-table-011.html may be another bug. That happens when using `rotateX(90)` in the outer div. (If we change it to other values, e.g. 80deg or 100deg, our behavior is the same as Blink.)
Revision 9 by
on 
So looks like `preserve-3d` on `<table>` or `<div style="display: table;"></div>` doesn't take effect.

[`mTransformStyle` of `nsTableWrapperFrame` is always `flat`](https://searchfox.org/mozilla-central/rev/253125d1947acbc3033b7b2e3a9a0d1bf4358a2d/layout/generic/nsIFrame.cpp#1769) even if we set `transform-style: preserve-3d` to table element.

e.g. we can simplify these failed test cases to this one:
```
<style>
#outer {
  transform-style: preserve-3d;
  transform: rotateY(30deg);
  display: table;
}
#target {
  width: 100px;
  height: 100px;
  background: green;
  transform: rotateX(30deg);
}
</style>
<div id=outer>
  <div id=target></div>
</div>
```
And Gecko doesn't render `target` and `outer` in the same 3D space.

I tried to hack `nsIFrame::Extend3DContext()` to make it always return true for `nsTableWrapperFrame`, but the elements inside the table disappears. :( (It's bug 1560704)

Note: The reason that we failed the test which uses `display: table-cell` in css/css-transforms/transform-table-011.html may be another bug. That happens when using `rotateX(90deg)` in the outer div. (If we change it to other values, e.g. 80deg or 100deg, our behavior is the same as Blink.)

Back to Bug 733849 Comment 17