mirror of
https://github.com/rn10950/RetroZilla.git
synced 2024-11-11 10:20:19 +01:00
151 lines
2.7 KiB
HTML
151 lines
2.7 KiB
HTML
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Test case for width property as applied to blocks</title>
|
||
|
|
<style>
|
||
|
|
div.b { border: 2px solid black; }
|
||
|
|
div.bp { border: 2px solid black; padding: 2px; }
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div style="width: 400px; border: 2px dashed green;">
|
||
|
|
|
||
|
|
Percentage width outer div with no border or padding:
|
||
|
|
|
||
|
|
<div style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
|
||
|
|
<div style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="b" style="width: 50px;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="bp" style="width: 50px;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="b" style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="bp" style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<hr>
|
||
|
|
|
||
|
|
Percentage width outer div with border:
|
||
|
|
|
||
|
|
<div class="b" style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
|
||
|
|
<div style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="b" style="width: 50px;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="bp" style="width: 50px;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="b" style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="bp" style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<hr>
|
||
|
|
|
||
|
|
Percentage width outer div with border and padding:
|
||
|
|
|
||
|
|
<div class="bp" style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
|
||
|
|
<div style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="b" style="width: 50px;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="bp" style="width: 50px;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="b" style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="bp" style="width: 50%;">
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
Text in a div.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|