| |
| <HTML> |
| <HEAD> |
| <TITLE>Comparison of positioning schemes</TITLE> |
| <style> |
| body { display: block; font-size:12px; line-height: 200%; |
| width: 400px; height: 400px } |
| p { display: block } |
| span { display: inline } |
| #outer { |
| position: relative; |
| color: red |
| } |
| #inner { |
| position: absolute; |
| top: 200px; left: -100px; |
| height: 130px; width: 130px; |
| color: blue; |
| } |
| </style> |
| </HEAD> |
| <BODY> |
| <P>Beginning of body contents. |
| <SPAN id="outer"> Start of outer contents. |
| <SPAN id="inner"> Inner contents.</SPAN> |
| <SPAN id="sibling"> Sibling contents.</SPAN> |
| End of outer contents.</SPAN> |
| End of body contents. |
| </P> |
| </BODY> |
| </HTML> |
