mirror of
				https://github.com/RGBCube/serenity
				synced 2025-10-31 04:52:45 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			165 lines
		
	
	
	
		
			4.8 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			165 lines
		
	
	
	
		
			4.8 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
 | |
| <html>
 | |
|     <head>
 | |
|         <title>display/box/float/clear test</title>
 | |
|         <style type="text/css">
 | |
|             /* last modified: 1 Dec 98 */
 | |
| 
 | |
|             html {
 | |
|                 font: 10px/1 'SerenitySans';
 | |
|                 background-color: blue;
 | |
|                 color: white;
 | |
|             }
 | |
| 
 | |
|             body {
 | |
|                 margin: 1.5em;
 | |
|                 border: 0.5em solid black;
 | |
|                 padding: 0;
 | |
|                 width: 48em;
 | |
|                 background-color: white;
 | |
|             }
 | |
| 
 | |
|             dl {
 | |
|                 margin: 0;
 | |
|                 border: 0;
 | |
|                 padding: 0.5em;
 | |
|             }
 | |
| 
 | |
|             dt {
 | |
|                 background-color: rgb(204, 0, 0);
 | |
|                 margin: 0;
 | |
|                 padding: 1em;
 | |
|                 width: 10.638%; /* refers to parent element's width of 47em. = 5em or 50px */
 | |
|                 height: 28em;
 | |
|                 border: 0.5em solid black;
 | |
|                 float: left;
 | |
|             }
 | |
| 
 | |
|             dd {
 | |
|                 float: right;
 | |
|                 margin: 0 0 0 1em;
 | |
|                 border: 1em solid black;
 | |
|                 padding: 1em;
 | |
|                 width: 34em;
 | |
|                 height: 27em;
 | |
|             }
 | |
| 
 | |
|             ul {
 | |
|                 margin: 0;
 | |
|                 border: 0;
 | |
|                 padding: 0;
 | |
|             }
 | |
| 
 | |
|             li {
 | |
|                 display: block; /* i.e., suppress marker */
 | |
|                 color: black;
 | |
|                 height: 9em;
 | |
|                 width: 5em;
 | |
|                 margin: 0;
 | |
|                 border: 0.5em solid black;
 | |
|                 padding: 1em;
 | |
|                 float: left;
 | |
|                 background-color: #fc0;
 | |
|             }
 | |
| 
 | |
|             #bar {
 | |
|                 background-color: black;
 | |
|                 color: white;
 | |
|                 width: 41.17%; /* = 14em */
 | |
|                 border: 0;
 | |
|                 margin: 0 1em;
 | |
|             }
 | |
| 
 | |
|             #baz {
 | |
|                 margin: 1em 0;
 | |
|                 border: 0;
 | |
|                 padding: 1em;
 | |
|                 width: 10em;
 | |
|                 height: 10em;
 | |
|                 background-color: black;
 | |
|                 color: white;
 | |
|             }
 | |
| 
 | |
|             form {
 | |
|                 margin: 0;
 | |
|                 display: inline;
 | |
|             }
 | |
| 
 | |
|             p {
 | |
|                 margin: 0;
 | |
|             }
 | |
| 
 | |
|             form p {
 | |
|                 line-height: 1.9;
 | |
|             }
 | |
| 
 | |
|             blockquote {
 | |
|                 margin: 1em 1em 1em 2em;
 | |
|                 border-width: 1em 1.5em 2em 0.5em;
 | |
|                 border-style: solid;
 | |
|                 border-color: black;
 | |
|                 padding: 1em 0;
 | |
|                 width: 5em;
 | |
|                 height: 9em;
 | |
|                 float: left;
 | |
|                 background-color: #fc0;
 | |
|                 color: black;
 | |
|             }
 | |
| 
 | |
|             address {
 | |
|                 font-style: normal;
 | |
|             }
 | |
| 
 | |
|             h1 {
 | |
|                 background-color: black;
 | |
|                 color: white;
 | |
|                 float: left;
 | |
|                 margin: 1em 0;
 | |
|                 border: 0;
 | |
|                 padding: 1em;
 | |
|                 width: 10em;
 | |
|                 height: 10em;
 | |
|                 font-weight: normal;
 | |
|                 font-size: 1em;
 | |
|             }
 | |
|         </style>
 | |
|     </head>
 | |
|     <body>
 | |
|         <dl>
 | |
|             <dt>toggle</dt>
 | |
|             <dd>
 | |
|                 <ul>
 | |
|                     <li>the way</li>
 | |
|                     <li id="bar">
 | |
|                         <p>the world ends</p>
 | |
|                         <form action="./" method="get">
 | |
|                             <p>
 | |
|                                 bang
 | |
|                                 <input type="radio" name="foo" value="off" />
 | |
|                             </p>
 | |
|                             <p>
 | |
|                                 whimper
 | |
|                                 <input type="radio" name="foo2" value="on" />
 | |
|                             </p>
 | |
|                         </form>
 | |
|                     </li>
 | |
|                     <li>i grow old</li>
 | |
|                     <li id="baz">pluot?</li>
 | |
|                 </ul>
 | |
|                 <blockquote>
 | |
|                     <address>bar maids,</address>
 | |
|                 </blockquote>
 | |
|                 <h1>sing to me, erbarme dich</h1>
 | |
|             </dd>
 | |
|         </dl>
 | |
|         <p style="color: black; font-size: 1em; line-height: 1.3em; clear: both">
 | |
|             This is a nonsensical document, but syntactically valid HTML 4.0. All 100%-conformant
 | |
|             CSS1 agents should be able to render the document elements above this paragraph
 | |
|             indistinguishably (to the pixel) from this
 | |
|             <a href="sec5526c.gif">reference rendering,</a>
 | |
|             (except font rasterization and form widgets). All discrepancies should be traceable to
 | |
|             CSS1 implementation shortcomings. Once you have finished evaluating this test, you can
 | |
|             return to the <a href="sec5526c.htm">parent page</a>.
 | |
|         </p>
 | |
|     </body>
 | |
| </html>
 | 
