blob: 973e22440f6cb5ac6b40587f0ad32c6243b9821f [file] [log] [blame]
<!DOCTYPE html>
<!--
| Blockification should not affect the outer display style used for the static position.
| https://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width
| https://www.w3.org/TR/CSS21/visuren.html#dis-pos-flo
-->
<html>
<head>
<style>
body {
margin: 0px;
font-family: Roboto;
font-size: 30px;
font-weight: bold;
}
.block {
display: block;
}
.inline {
display: inline;
}
.inline-block {
background-color: #0091ea;
display: inline-block;
}
.absolute {
position: absolute;
}
.fixed {
position: fixed;
}
.lightblue {
background-color: #40c4ff;
}
.cobaltblue {
background-color: #00b0ff;
}
.darkblue {
background-color: #0091ea;
}
</style>
</head>
<body>
<div>
<span class="lightblue">
inline
<span class="absolute darkblue">absolute</span>
</span>
</div>
<div>
<span class="lightblue">
inline
<div class="inline absolute darkblue">absolute</span>
</span>
</div>
<div>
<span class="lightblue">
inline
<div class="inline-block absolute darkblue">absolute</span>
</span>
</div>
<div>
<span class="lightblue">
inline
<span class="fixed darkblue">fixed</span>
</span>
</div>
<div>
<span class="lightblue">
inline
<div class="inline fixed darkblue">fixed</span>
</span>
</div>
<div>
<span class="lightblue">
inline
<div class="inline-block fixed darkblue">fixed</span>
</span>
</div>
</body>
</html>