1234567891011121314151617181920212223242526272829303132333435 |
- <!DOCTYPE html>
- <html lang="en">
- <meta charset="utf-8">
- <title>z-index should work correctly for elements with perspective</title>
- <style>
- #perspective {
- perspective: 300px;
- perspective-origin: top left;
- }
- #front {
- z-index: 2;
- width: 100px;
- height: 100px;
- background-color: #00FF00;
- transform: translateX(0px);
- }
- #back {
- z-index: 1;
- width: 100px;
- height: 100px;
- background-color: #FF0000;
- transform: translateY(-100px);
- }
- </style>
- <div id="perspective">
- <div id="front"></div>
- <div id="back"></div>
- </div>
|