| <html> |
| <head> |
| <style> |
| div.crossTop { |
| height: 100px; |
| width: 300px; |
| background-color:green; |
| display: -moz-box; |
| display: -khtml-box; |
| display: box; |
| -moz-box-align: center; |
| -khtml-box-align: center; |
| box-align: center; |
| -moz-box-orient: horizontal; |
| -khtml-box-orient: horizontal; |
| box-orient: horizontal; |
| } |
| |
| div.crossBar { |
| height: 300px; |
| width: 100px; |
| background-color:green; |
| margin-left: 100px; |
| margin-top: -100px; |
| } |
| </style> |
| </head> |
| <body> |
| You should see a green cross below (300 pixels wide and 300 pixels tall). This is a test to ensure that |
| boxes don't obey the overconstraint correction (margin-top/bottom should not be corrected when a box is |
| overconstrained). |
| |
| <div style="padding-top:200px; padding-left:0px"> |
| <div class="crossTop"> |
| <div class="crossBar"></div> |
| </div> |
| </div> |
| </body> |
| </html> |