| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" |
| "http://www.w3.org/TR/REC-html40/strict.dtd"> |
| |
| <HTML> |
| <HEAD> |
| |
| <title>Miscellaneous NGLayout Tests</title> |
| |
| <STYLE TYPE="text/css"> |
| <!-- |
| HTML { background: #0F9; color: black;} |
| |
| BODY { |
| background: #9fc; |
| font-family: verdana, arial, geneva, sans-serif; |
| border: medium solid black; |
| width: 85%; |
| margin: 4em auto; |
| padding: 0; |
| } |
| |
| UL.top { |
| background: #0c9; |
| margin: 0; |
| padding: 0.3em; |
| } |
| |
| UL.top { display: table-row; margin: 0; padding: 0; } |
| |
| UL.top LI { margin: 0; padding: 0; display: table-cell; width: 25%; text-align: center; } |
| |
| DIV.main { |
| margin: 0; |
| padding: 1em; |
| } |
| |
| FORM { |
| margin-left: 5em; |
| } |
| |
| P { |
| margin: 0; |
| padding: 0; |
| font: 1.0em/2.0 verdana, arial, geneva, sans-serif; |
| } |
| |
| .label { font-family: arial, helvetica, sans-serif; font-size: 0.9em; } |
| |
| SPAN.formgroup { display: inline-table; } |
| |
| SPAN.formgroup > * { display: table-row; } |
| |
| --> |
| </STYLE> |
| |
| </HEAD> |
| |
| <body> |
| |
| <p>These links are in an element with display table-row, and the li elements |
| have display: table-cell. They disappear:</p> |
| |
| <ul class="top"> |
| <li><a href="people.html">people</a></li> |
| <li><a href="places.html">places</a></li> |
| <li><a href="members.html">members</a></li> |
| <li><a href="links.html">links</a></li> |
| </ul> |
| |
| <div class="main"> |
| |
| This text is not in the form. The form should be indented 40px. |
| |
| <form method="post" action=""> |
| <p> This is text in the form. It should be indented 40px. |
| The form itself has the same table-row/table-cell problem as |
| above.</p> |
| |
| <p> |
| <span class="formgroup"><span class="label">First Name (required)</span> |
| <input type="text" name="fname" size="16"> |
| </span> |
| <span class="formgroup"> <span class="label">Last Name (required)</span> |
| <input type="text" name="lname" size="16"> |
| </span> |
| </p> |
| <p> |
| <span class="formgroup"><span class="label">Email Address</span> |
| <input type="text" name="iemail" size="40"> |
| </span> |
| </p> |
| <p> |
| <span class="formgroup"><span class="label">Company Name</span> |
| <input type="text" name="coname" size="16"> |
| </span> |
| <span class="formgroup"><span class="label">Title</span> |
| <input type="text" name="title" size="16"> |
| </span> |
| </p> |
| <p> |
| <input type="Submit" name="submit" value="Submit!"> |
| <input type="reset" value="Clear Form" name="reset"> |
| </p> |
| </form> |
| |
| </div> <!-- main --> |
| |
| </BODY> |
| </HTML> |
| |