blob: 1eca2805f57cb631934b6632620ee7c384d0ec7c [file] [log] [blame]
<!DOCTYPE html>
<!--
| Absolutely positioned elements should not participate in layout and therefore
| if multiple absolutely positioned objects are defined under the same parent,
| they should all have the same static position set on them.
-->
<html>
<head>
<style>
.block1 {
position: absolute;
width: 50px;
height: 50px;
transform: translateX(100px);
background-color: rgb(255, 0, 0);
}
.block2 {
position: absolute;
width: 50px;
height: 50px;
transform: translateY(100px);
background-color: rgb(0, 255, 0);
}
.block3 {
position: absolute;
width: 50px;
height: 50px;
transform: translateX(100px) translateY(100px);
background-color: rgb(0, 0, 255);
}
.block4 {
width: 50px;
height: 50px;
background-color: rgb(255, 0, 255);
}
</style>
</head>
<body>
<div class="block1">
</div>
<div class="block2">
</div>
<div class="block3">
</div>
<div class="block4">
</div>
</body>
</html>