зеркало из https://github.com/mozilla/gecko-dev.git
124 строки
4.5 KiB
HTML
124 строки
4.5 KiB
HTML
<!DOCTYPE HTML>
|
|
<title>viewport units rounding reference</title>
|
|
<meta charset="UTF-8">
|
|
<style>
|
|
div.contain { height: 50px }
|
|
div.contain > div { height: 10px }
|
|
div.contain > div > div { height: 10px; float: left }
|
|
</style>
|
|
|
|
<div class="contain" style="width: 200px">
|
|
<div>
|
|
<div style="width: 50px; background: fuchsia"></div>
|
|
<div style="width: 50px; background: aqua"></div>
|
|
<div style="width: 50px; background: silver"></div>
|
|
<div style="width: 50px; background: yellow"></div>
|
|
</div>
|
|
<div>
|
|
<div style="width: 48px; background: fuchsia"></div>
|
|
<div style="width: 48px; background: aqua"></div>
|
|
<div style="width: 48px; background: silver"></div>
|
|
<div style="width: 48px; background: yellow"></div>
|
|
<div style="width: 8px; background: gray"></div>
|
|
</div>
|
|
<div>
|
|
<div style="width: 42px; background: fuchsia"></div>
|
|
<div style="width: 42px; background: aqua"></div>
|
|
<div style="width: 42px; background: silver"></div>
|
|
<div style="width: 42px; background: yellow"></div>
|
|
<div style="width: 32px; background: gray"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="contain" style="width: 201px">
|
|
<div>
|
|
<div style="width: 50px; background: fuchsia"></div>
|
|
<div style="width: 51px; background: aqua"></div>
|
|
<div style="width: 50px; background: silver"></div>
|
|
<div style="width: 50px; background: yellow"></div>
|
|
</div>
|
|
<div>
|
|
<div style="width: 48px; background: fuchsia"></div>
|
|
<div style="width: 48px; background: aqua"></div>
|
|
<div style="width: 49px; background: silver"></div>
|
|
<div style="width: 48px; background: yellow"></div>
|
|
<div style="width: 8px; background: gray"></div>
|
|
</div>
|
|
<div>
|
|
<div style="width: 42px; background: fuchsia"></div>
|
|
<div style="width: 42px; background: aqua"></div>
|
|
<div style="width: 43px; background: silver"></div>
|
|
<div style="width: 42px; background: yellow"></div>
|
|
<div style="width: 32px; background: gray"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="contain" style="width: 202px">
|
|
<div>
|
|
<div style="width: 51px; background: fuchsia"></div>
|
|
<div style="width: 50px; background: aqua"></div>
|
|
<div style="width: 51px; background: silver"></div>
|
|
<div style="width: 50px; background: yellow"></div>
|
|
</div>
|
|
<div>
|
|
<div style="width: 48px; background: fuchsia"></div>
|
|
<div style="width: 49px; background: aqua"></div>
|
|
<div style="width: 48px; background: silver"></div>
|
|
<div style="width: 49px; background: yellow"></div>
|
|
<div style="width: 8px; background: gray"></div>
|
|
</div>
|
|
<div>
|
|
<div style="width: 42px; background: fuchsia"></div>
|
|
<div style="width: 43px; background: aqua"></div>
|
|
<div style="width: 42px; background: silver"></div>
|
|
<div style="width: 43px; background: yellow"></div>
|
|
<div style="width: 32px; background: gray"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="contain" style="width: 203px">
|
|
<div>
|
|
<div style="width: 51px; background: fuchsia"></div>
|
|
<div style="width: 51px; background: aqua"></div>
|
|
<div style="width: 50px; background: silver"></div>
|
|
<div style="width: 51px; background: yellow"></div>
|
|
</div>
|
|
<div>
|
|
<div style="width: 49px; background: fuchsia"></div>
|
|
<div style="width: 48px; background: aqua"></div>
|
|
<div style="width: 49px; background: silver"></div>
|
|
<div style="width: 49px; background: yellow"></div>
|
|
<div style="width: 8px; background: gray"></div>
|
|
</div>
|
|
<div>
|
|
<div style="width: 43px; background: fuchsia"></div>
|
|
<div style="width: 42px; background: aqua"></div>
|
|
<div style="width: 43px; background: silver"></div>
|
|
<div style="width: 42px; background: yellow"></div>
|
|
<div style="width: 33px; background: gray"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="contain" style="width: 204px">
|
|
<div>
|
|
<div style="width: 51px; background: fuchsia"></div>
|
|
<div style="width: 51px; background: aqua"></div>
|
|
<div style="width: 51px; background: silver"></div>
|
|
<div style="width: 51px; background: yellow"></div>
|
|
</div>
|
|
<div>
|
|
<div style="width: 49px; background: fuchsia"></div>
|
|
<div style="width: 49px; background: aqua"></div>
|
|
<div style="width: 49px; background: silver"></div>
|
|
<div style="width: 49px; background: yellow"></div>
|
|
<div style="width: 8px; background: gray"></div>
|
|
</div>
|
|
<div>
|
|
<div style="width: 43px; background: fuchsia"></div>
|
|
<div style="width: 43px; background: aqua"></div>
|
|
<div style="width: 43px; background: silver"></div>
|
|
<div style="width: 42px; background: yellow"></div>
|
|
<div style="width: 33px; background: gray"></div>
|
|
</div>
|
|
</div>
|