69 lines
3.2 KiB
HTML
69 lines
3.2 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
|
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
|
|
<head>
|
|
<style type="text/css">
|
|
dl {
|
|
display: table;
|
|
}
|
|
|
|
.dl-section {
|
|
display: table-row;
|
|
}
|
|
|
|
dl dt {
|
|
display: table-cell;
|
|
}
|
|
|
|
dl dd {
|
|
display: table-cell;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<p>This is a regression test for <i><a href="https://bugs.webkit.org/show_bug.cgi?id=9122">http://bugzilla.opendarwin.org/show_bug.cgi?id=9122</a>
|
|
REGRESSION: Incorrect vertical position for text fields in a "display: table" block</i>.
|
|
<p>Type something in the text field. Resize the window. The text field should not jump down. Delete what you typed and resize the window. The text field should not move.</p>
|
|
<form action="foo" method="get">
|
|
<dl>
|
|
<div class="dl-section">
|
|
<dt>Foo</dt>
|
|
<dd><input type="text" /></dd>
|
|
</div>
|
|
</dl>
|
|
<hr />
|
|
<p>And here's more. There should not be a difference in distance between the labels, nor any difference in distance between the text fields.</p>
|
|
<dl>
|
|
<div class="dl-section">
|
|
<dt>Foo</dt>
|
|
<dd><input type="text" /></dd>
|
|
</div>
|
|
<div class="dl-section">
|
|
<dt>Foo</dt>
|
|
<dd><input type="text" /></dd>
|
|
</div>
|
|
<div class="dl-section">
|
|
<dt>Foo</dt>
|
|
<dd><input type="text" value="Bar" /></dd>
|
|
</div>
|
|
<div class="dl-section">
|
|
<dt>Foo</dt>
|
|
<dd><input type="text" value="Bar" /></dd>
|
|
</div>
|
|
<div class="dl-section">
|
|
<dt>Foo</dt>
|
|
<dd><input type="text" /></dd>
|
|
</div>
|
|
<div class="dl-section">
|
|
<dt>Foo</dt>
|
|
<dd><input type="text" /></dd>
|
|
</div>
|
|
<div class="dl-section">
|
|
<dt>Foo</dt>
|
|
<dd><div style="display: inline-block;"><br>Bar (should be aligned with Foo)</div></dd>
|
|
</div>
|
|
</dl>
|
|
</form>
|
|
</body>
|
|
</html>
|