Attachment #179285 for bug #102560

View Details Raw Unified Return to Bug 102560

| Differences between



2012-12-12  Tim Volodine  <timvolodine@google.com>

        Text Autosizing: Work out what to do about form controls
        https://bugs.webkit.org/show_bug.cgi?id=102560

        Reviewed by NOBODY (OOPS!).

        Disallow autosizing of form input controls like buttons, text input fields, selection controls, radio buttons
        and check boxes. This is a short term solution to avoid inconsistent autosizing of form controls (which is
        worse than not autosizing at all).

        Tests: fast/text-autosizing/form-controls-boosting-button-textarea-input-elements.html
               fast/text-autosizing/form-controls-boosting-checkbox-input-element.html
               fast/text-autosizing/form-controls-boosting-radio-input-element.html
               fast/text-autosizing/form-controls-boosting-select-element.html

        * rendering/TextAutosizer.cpp:
        (WebCore):
        (WebCore::TextAutosizer::containerShouldBeAutosized):
        (WebCore::TextAutosizer::contentHeightIsConstrained):
        (WebCore::TextAutosizer::processContainer):
        (WebCore::TextAutosizer::isAutosizingContainer):
        (WebCore::TextAutosizer::containerContainsTags):
        (WebCore::TextAutosizer::measureDescendantTextWidth):
        (WebCore::TextAutosizer::findDeepestBlockContainingAllText):
        * rendering/TextAutosizer.h:

2012-12-04  Antoine Quint  <graouts@apple.com>

        TextTrack's .kind property should return lower-case values

Lines 25-30 a/Source/WebCore/rendering/TextAutosizer.cpp_sec1
- a/Source/WebCore/rendering/TextAutosizer.cpp -4 / +42 lines
25	#include "TextAutosizer.h"	25	#include "TextAutosizer.h"
26		26
27	#include "Document.h"	27	#include "Document.h"
		28	#include "HTMLElement.h"
28	#include "InspectorInstrumentation.h"	29	#include "InspectorInstrumentation.h"
29	#include "RenderObject.h"	30	#include "RenderObject.h"
30	#include "RenderStyle.h"	31	#include "RenderStyle.h"
Lines 37-50 a/Source/WebCore/rendering/TextAutosizer.cpp_sec2
37		38
38	namespace WebCore {	39	namespace WebCore {
39		40
		41	using namespace HTMLNames;
		42
40	struct TextAutosizingWindowInfo {	43	struct TextAutosizingWindowInfo {
41	IntSize windowSize;	44	IntSize windowSize;
42	IntSize minLayoutSize;	45	IntSize minLayoutSize;
43	};	46	};
44		47
		48	// holds the tags for the form input elements
		49	static Vector<QualifiedName> s_inputTags;
		50
45	TextAutosizer::TextAutosizer(Document* document)	51	TextAutosizer::TextAutosizer(Document* document)
46	: m_document(document)	52	: m_document(document)
47	{	53	{
		54	s_inputTags.append(inputTag);
		55	s_inputTags.append(textareaTag);
		56	s_inputTags.append(buttonTag);
		57	s_inputTags.append(selectTag);
48	}	58	}
49		59
50	TextAutosizer::~TextAutosizer()	60	TextAutosizer::~TextAutosizer()
Lines 119-125 void TextAutosizer::processCluster(RenderBlock* cluster, RenderBlock* container, a/Source/WebCore/rendering/TextAutosizer.cpp_sec3
119	processContainer(multiplier, container, subtreeRoot, windowInfo);	129	processContainer(multiplier, container, subtreeRoot, windowInfo);
120	}	130	}
121		131
122	static bool contentHeightIsConstrained(const RenderBlock* container)	132	bool TextAutosizer::containerShouldBeAutosized(const RenderBlock* container)
		133	{
		134	if (containerContainsTags(container, s_inputTags))
		135	return false;
		136
		137	return !contentHeightIsConstrained(container);
		138	}
		139
		140	bool TextAutosizer::contentHeightIsConstrained(const RenderBlock* container)
123	{	141	{
124	// FIXME: Propagate constrainedness down the tree, to avoid inefficiently walking back up from each box.	142	// FIXME: Propagate constrainedness down the tree, to avoid inefficiently walking back up from each box.
125	// FIXME: This code needs to take into account vertical writing modes.	143	// FIXME: This code needs to take into account vertical writing modes.
Lines 143-149 void TextAutosizer::processContainer(float multiplier, RenderBlock* container, R a/Source/WebCore/rendering/TextAutosizer.cpp_sec4
143	{	161	{
144	ASSERT(isAutosizingContainer(container));	162	ASSERT(isAutosizingContainer(container));
145		163
146	float localMultiplier = contentHeightIsConstrained(container) ? 1 : multiplier;	164	float localMultiplier = containerShouldBeAutosized(container) ? multiplier : 1;
147		165
148	RenderObject* descendant = nextInPreOrderSkippingDescendantsOfContainers(subtreeRoot, subtreeRoot);	166	RenderObject* descendant = nextInPreOrderSkippingDescendantsOfContainers(subtreeRoot, subtreeRoot);
149	while (descendant) {	167	while (descendant) {
Lines 211-216 bool TextAutosizer::isAutosizingContainer(const RenderObject* renderer) a/Source/WebCore/rendering/TextAutosizer.cpp_sec5
211	return false;	229	return false;
212	if (renderer->isListItem())	230	if (renderer->isListItem())
213	return renderer->isFloating() \|\| renderer->isOutOfFlowPositioned();	231	return renderer->isFloating() \|\| renderer->isOutOfFlowPositioned();
		232	// avoid creating containers for text within text controls, buttons, or selection menus.
		233	Node* parentNode = renderer->parent() ? renderer->parent()->generatingNode() : 0;
		234	if (parentNode && parentNode->isHTMLElement() && s_inputTags.contains(toElement(parentNode)->tagQName()))
		235	return false;
		236
214	return true;	237	return true;
215	}	238	}
216		239
Lines 271-279 bool TextAutosizer::clusterShouldBeAutosized(const RenderBlock* lowestCommonAnce a/Source/WebCore/rendering/TextAutosizer.cpp_sec6
271	return false;	294	return false;
272	}	295	}
273		296
		297	bool TextAutosizer::containerContainsTags(const RenderBlock* container, Vector<QualifiedName>& tags)
		298	{
		299	const RenderObject* runningObject = container;
		300	while (runningObject) {
		301	const Node* runningNode = runningObject->node();
		302	if (runningNode && runningNode->isHTMLElement()) {
		303	if (tags.contains(toElement(runningNode)->tagQName()))
		304	return true;
		305	}
		306	runningObject = nextInPreOrderSkippingDescendantsOfContainers(runningObject, container);
		307	}
		308
		309	return false;
		310	}
		311
274	void TextAutosizer::measureDescendantTextWidth(const RenderBlock* container, float minTextWidth, float& textWidth)	312	void TextAutosizer::measureDescendantTextWidth(const RenderBlock* container, float minTextWidth, float& textWidth)
275	{	313	{
276	bool skipLocalText = contentHeightIsConstrained(container);	314	bool skipLocalText = !containerShouldBeAutosized(container);
277		315
278	RenderObject* descendant = nextInPreOrderSkippingDescendantsOfContainers(container, container);	316	RenderObject* descendant = nextInPreOrderSkippingDescendantsOfContainers(container, container);
279	while (descendant) {	317	while (descendant) {
Lines 319-325 const RenderBlock* TextAutosizer::findDeepestBlockContainingAllText(const Render a/Source/WebCore/rendering/TextAutosizer.cpp_sec7
319	const RenderObject* lastTextLeaf = findFirstTextLeafNotInCluster(cluster, lastDepth, LastToFirst);	357	const RenderObject* lastTextLeaf = findFirstTextLeafNotInCluster(cluster, lastDepth, LastToFirst);
320	ASSERT(lastTextLeaf);	358	ASSERT(lastTextLeaf);
321		359
322	// Equalize the depths if necessary. Only one of the while loops below will get executed.	360	// Equalize the depths if containerShouldBeAutosized necessary. Only one of the while loops below will get executed.
323	const RenderObject* firstNode = firstTextLeaf;	361	const RenderObject* firstNode = firstTextLeaf;
324	const RenderObject* lastNode = lastTextLeaf;	362	const RenderObject* lastNode = lastTextLeaf;
325	while (firstDepth > lastDepth) {	363	while (firstDepth > lastDepth) {

Lines 28-33 a/Source/WebCore/rendering/TextAutosizer.h_sec1
- a/Source/WebCore/rendering/TextAutosizer.h +4 lines
28		28
29	#if ENABLE(TEXT_AUTOSIZING)	29	#if ENABLE(TEXT_AUTOSIZING)
30		30
		31	#include "HTMLNames.h"
31	#include "IntSize.h"	32	#include "IntSize.h"
32	#include <wtf/Noncopyable.h>	33	#include <wtf/Noncopyable.h>
33	#include <wtf/PassOwnPtr.h>	34	#include <wtf/PassOwnPtr.h>
Lines 71-76 private: a/Source/WebCore/rendering/TextAutosizer.h_sec2
71	static bool isAutosizingCluster(const RenderBlock*);	72	static bool isAutosizingCluster(const RenderBlock*);
72		73
73	static bool clusterShouldBeAutosized(const RenderBlock* lowestCommonAncestor, float commonAncestorWidth);	74	static bool clusterShouldBeAutosized(const RenderBlock* lowestCommonAncestor, float commonAncestorWidth);
		75	static bool containerShouldBeAutosized(const RenderBlock* container);
		76	static bool contentHeightIsConstrained(const RenderBlock* container);
		77	static bool containerContainsTags(const RenderBlock* cluster, Vector<QualifiedName>& tags);
74	static void measureDescendantTextWidth(const RenderBlock* container, float minTextWidth, float& textWidth);	78	static void measureDescendantTextWidth(const RenderBlock* container, float minTextWidth, float& textWidth);
75		79
76	// Use to traverse the tree of descendants, excluding descendants of containers (but returning the containers themselves).	80	// Use to traverse the tree of descendants, excluding descendants of containers (but returning the containers themselves).



2012-12-12  Tim Volodine  <timvolodine@google.com>

        Text Autosizing: Work out what to do about form controls
        https://bugs.webkit.org/show_bug.cgi?id=102560

        Reviewed by NOBODY (OOPS!).

        Tests for form input elements autosizing. Added tests to check that various kinds of form elements
        don't get autosized, i.e. buttons, textareas, check boxes, radio button and selection menus.

        * fast/text-autosizing/form-controls-boosting-button-textarea-input-elements-expected.html: Added.
        * fast/text-autosizing/form-controls-boosting-button-textarea-input-elements.html: Added.
        * fast/text-autosizing/form-controls-boosting-checkbox-input-element-expected.html: Added.
        * fast/text-autosizing/form-controls-boosting-checkbox-input-element.html: Added.
        * fast/text-autosizing/form-controls-boosting-radio-input-element-expected.html: Added.
        * fast/text-autosizing/form-controls-boosting-radio-input-element.html: Added.
        * fast/text-autosizing/form-controls-boosting-select-element-expected.html: Added.
        * fast/text-autosizing/form-controls-boosting-select-element.html: Added.

2012-12-04  Antoine Quint  <graouts@apple.com>

        TextTrack's .kind property should return lower-case values



<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=800">
<style>
  body {
    width: 800px;
    margin: 0;
    overflow-y: hidden;
  }
  
  #header form {
    font-size: 85%;
    display: inline;
  }
  
  #header .links {
    font-size: 85%;
  }
  
  ul.links {
    margin: 0;
    padding: 0;
    list-style-type: none;
  }

  ul.links li {
    display: inline;
    white-space: nowrap;
  }
</style>

</head>
<body>

<div id="header">
  <ul class="links">
    <li>
      <a href="./">Home</a>
    </li>
    <li>
      <span>| </span>
      <a href="">New</a>
    </li>
    <li>
      <span>| </span>
      <a href="">Search</a>
    </li>
    <li>
      <span>| </span>
      <form>
        <input class="txt" type="text" id="quicksearch_top" name="quicksearch">
        <input class="btn" type="submit" value="Find" id=find_top">
      </form>
    </li>
    <li>
      <span>| </span>
      <a href="">Reports</a>
    </li>
  </ul>
</div>

<div>
  <p><div style="font-size: 2.5rem">
  This test checks that form controls like buttons, text inputs and check-boxes are not autosized.
  The text in this paragraph should be autosized, while the form controls above and below should not.
  The "Find" button and text-input box at the bottom of the page should not be autosized.
  </div></p>

  <form>
  <div>
    <p><div style="font-size: 2.5rem">
    This text should be autosized, while the input controls below should not.
    </div></p>
    <input id="quicksearch" type="text" name="quicksearch">
    <input id="find" type="submit" value="Find">
  </div>
  </form>

</div>

</body>
</html>



<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=800">
<style>
  body {
    width: 800px;
    margin: 0;
    overflow-y: hidden;
  }
  
  #header form {
    font-size: 85%;
    display: inline;
  }
  
  #header .links {
    font-size: 85%;
  }
  
  ul.links {
    margin: 0;
    padding: 0;
    list-style-type: none;
  }

  ul.links li {
    display: inline;
    white-space: nowrap;
  }
</style>

<script>
if (window.internals) {
    window.internals.settings.setTextAutosizingEnabled(true);
    window.internals.settings.setTextAutosizingWindowSizeOverride(320, 480);
} else if (window.console && console.warn) {
    console.warn("This test depends on the Text Autosizing setting being true, so run it in DumpRenderTree, or manually enable Text Autosizing, and either use a mobile device with 320px device-width (like Nexus S or iPhone), or define HACK_FORCE_TEXT_AUTOSIZING_ON_DESKTOP.");
}
</script>

</head>
<body>

<div id="header">
  <ul class="links">
    <li>
      <a href="./">Home</a>
    </li>
    <li>
      <span>| </span>
      <a href="">New</a>
    </li>
    <li>
      <span>| </span>
      <a href="">Search</a>
    </li>
    <li>
      <span>| </span>
      <form>
        <input class="txt" type="text" id="quicksearch_top" name="quicksearch">
        <input class="btn" type="submit" value="Find" id=find_top">
      </form>
    </li>
    <li>
      <span>| </span>
      <a href="">Reports</a>
    </li>
  </ul>
</div>

<div>
  <p><div>
  This test checks that form controls like buttons, text inputs and check-boxes are not autosized.
  The text in this paragraph should be autosized, while the form controls above and below should not.
  The "Find" button and text-input box at the bottom of the page should not be autosized.
  </div></p>

  <form>
  <div>
    <p><div>
    This text should be autosized, while the input controls below should not.
    </div></p>
    <input id="quicksearch" type="text" name="quicksearch">
    <input id="find" type="submit" value="Find">
  </div>
  </form>

</div>

</body>
</html>



<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=800">
<style>
  body {
    width: 800px;
    margin: 0;
    overflow-y: hidden;
  }
</style>


</head>
<body>

<div>
<div style="font-size: 2.5rem">
This tests the autosizing of check boxes. This paragraph should be autosized, while
the check boxes below should not be autosized. Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
<div>
<form action="">
Check one or more:
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br/>
<input type="checkbox" name="vehicle" value="Car">I have a car <br/>
</form>
</div>
</div>

</body>
</html>



<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=800">
<style>
  body {
    width: 800px;
    margin: 0;
    overflow-y: hidden;
  }
</style>

<script>
if (window.internals) {
    window.internals.settings.setTextAutosizingEnabled(true);
    window.internals.settings.setTextAutosizingWindowSizeOverride(320, 480);
} else if (window.console && console.warn) {
    console.warn("This test depends on the Text Autosizing setting being true, so run it in DumpRenderTree, or manually enable Text Autosizing, and either use a mobile device with 320px device-width (like Nexus S or iPhone), or define HACK_FORCE_TEXT_AUTOSIZING_ON_DESKTOP.");
}
</script>

</head>
<body>

<div>
<div>
This tests the autosizing of check boxes. This paragraph should be autosized, while
the check boxes below should not be autosized. Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
<div>
<form action="">
Check one or more:
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br/>
<input type="checkbox" name="vehicle" value="Car">I have a car <br/>
</form>
</div>
</div>

</body>
</html>



<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=800">
<style>
  body {
    width: 800px;
    margin: 0;
    overflow-y: hidden;
  }
</style>


</head>
<body>

<div>
<div style="font-size: 2.5rem">
This tests the autosizing of radio buttons. This paragraph should be autosized, while
the radio buttons below should not be autosized. Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
<div>
<form action="">
Select one of:<br/>
<input type="radio" id="radio1" checked="checked"/>
<label for="radio1">Radio1</label><br/>
<input type="radio" id="radio2"/>
<label for="radio2">Radio2</label><br/>
</form>
</div>
</div>

</body>
</html>



<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=800">
<style>
  body {
    width: 800px;
    margin: 0;
    overflow-y: hidden;
  }
</style>

<script>
if (window.internals) {
    window.internals.settings.setTextAutosizingEnabled(true);
    window.internals.settings.setTextAutosizingWindowSizeOverride(320, 480);
} else if (window.console && console.warn) {
    console.warn("This test depends on the Text Autosizing setting being true, so run it in DumpRenderTree, or manually enable Text Autosizing, and either use a mobile device with 320px device-width (like Nexus S or iPhone), or define HACK_FORCE_TEXT_AUTOSIZING_ON_DESKTOP.");
}
</script>

</head>
<body>

<div>
<div>
This tests the autosizing of radio buttons. This paragraph should be autosized, while
the radio buttons below should not be autosized. Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
<div>
<form action="">
Select one of:<br/>
<input type="radio" id="radio1" checked="checked"/>
<label for="radio1">Radio1</label><br/>
<input type="radio" id="radio2"/>
<label for="radio2">Radio2</label><br/>
</form>
</div>
</div>

</body>
</html>



<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=800">
<style>
  body {
    width: 800px;
    margin: 0;
    overflow-y: hidden;
  }
</style>

</head>
<body>

<div>
<div style="font-size: 2.5rem">
This tests the autosizing of a selection menu element. This paragraph should be autosized, while
the selection box below should not be autosized. Lorem ipsum dolor sit amet, consectetur adipisicing
elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
<div>
<form action="">
Selection:
<select>
  <option selected value=default>Default</option>
  <option>Option 1</option>
  <option>Option 2</option>
</select>
</form>
</div>
</div>

</body>
</html>



<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=800">
<style>
  body {
    width: 800px;
    margin: 0;
    overflow-y: hidden;
  }
</style>

<script>
if (window.internals) {
    window.internals.settings.setTextAutosizingEnabled(true);
    window.internals.settings.setTextAutosizingWindowSizeOverride(320, 480);
} else if (window.console && console.warn) {
    console.warn("This test depends on the Text Autosizing setting being true, so run it in DumpRenderTree, or manually enable Text Autosizing, and either use a mobile device with 320px device-width (like Nexus S or iPhone), or define HACK_FORCE_TEXT_AUTOSIZING_ON_DESKTOP.");
}
</script>

</head>
<body>

<div>
<div>
This tests the autosizing of a selection menu element. This paragraph should be autosized, while
the selection box below should not be autosized. Lorem ipsum dolor sit amet, consectetur adipisicing
elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
<div>
<form action="">
Selection:
<select>
  <option selected value=default>Default</option>
  <option>Option 1</option>
  <option>Option 2</option>
</select>
</form>
</div>
</div>

</body>
</html>

Return to Bug 102560

Lines 1-3 a/Source/WebCore/ChangeLog_sec1
- a/Source/WebCore/ChangeLog +27 lines
		1	2012-12-12 Tim Volodine <timvolodine@google.com>
		2
		3	Text Autosizing: Work out what to do about form controls
		4	https://bugs.webkit.org/show_bug.cgi?id=102560
		5
		6	Reviewed by NOBODY (OOPS!).
		7
		8	Disallow autosizing of form input controls like buttons, text input fields, selection controls, radio buttons
		9	and check boxes. This is a short term solution to avoid inconsistent autosizing of form controls (which is
		10	worse than not autosizing at all).
		11
		12	Tests: fast/text-autosizing/form-controls-boosting-button-textarea-input-elements.html
		13	fast/text-autosizing/form-controls-boosting-checkbox-input-element.html
		14	fast/text-autosizing/form-controls-boosting-radio-input-element.html
		15	fast/text-autosizing/form-controls-boosting-select-element.html
		16
		17	* rendering/TextAutosizer.cpp:
		18	(WebCore):
		19	(WebCore::TextAutosizer::containerShouldBeAutosized):
		20	(WebCore::TextAutosizer::contentHeightIsConstrained):
		21	(WebCore::TextAutosizer::processContainer):
		22	(WebCore::TextAutosizer::isAutosizingContainer):
		23	(WebCore::TextAutosizer::containerContainsTags):
		24	(WebCore::TextAutosizer::measureDescendantTextWidth):
		25	(WebCore::TextAutosizer::findDeepestBlockContainingAllText):
		26	* rendering/TextAutosizer.h:
		27
1	2012-12-04 Antoine Quint <graouts@apple.com>	28	2012-12-04 Antoine Quint <graouts@apple.com>
2		29
3	TextTrack's .kind property should return lower-case values	30	TextTrack's .kind property should return lower-case values

Lines 1-3 a/LayoutTests/ChangeLog_sec1
- a/LayoutTests/ChangeLog +19 lines
		1	2012-12-12 Tim Volodine <timvolodine@google.com>
		2
		3	Text Autosizing: Work out what to do about form controls
		4	https://bugs.webkit.org/show_bug.cgi?id=102560
		5
		6	Reviewed by NOBODY (OOPS!).
		7
		8	Tests for form input elements autosizing. Added tests to check that various kinds of form elements
		9	don't get autosized, i.e. buttons, textareas, check boxes, radio button and selection menus.
		10
		11	* fast/text-autosizing/form-controls-boosting-button-textarea-input-elements-expected.html: Added.
		12	* fast/text-autosizing/form-controls-boosting-button-textarea-input-elements.html: Added.
		13	* fast/text-autosizing/form-controls-boosting-checkbox-input-element-expected.html: Added.
		14	* fast/text-autosizing/form-controls-boosting-checkbox-input-element.html: Added.
		15	* fast/text-autosizing/form-controls-boosting-radio-input-element-expected.html: Added.
		16	* fast/text-autosizing/form-controls-boosting-radio-input-element.html: Added.
		17	* fast/text-autosizing/form-controls-boosting-select-element-expected.html: Added.
		18	* fast/text-autosizing/form-controls-boosting-select-element.html: Added.
		19
1	2012-12-04 Antoine Quint <graouts@apple.com>	20	2012-12-04 Antoine Quint <graouts@apple.com>
2		21
3	TextTrack's .kind property should return lower-case values	22	TextTrack's .kind property should return lower-case values

Line 0 a/LayoutTests/fast/text-autosizing/form-controls-boosting-button-textarea-input-elements-expected.html_sec1
- a/LayoutTests/fast/text-autosizing/form-controls-boosting-button-textarea-input-elements-expected.html +84 lines
		1	<!DOCTYPE html>
		2	<html>
		3	<head>
		4
		5	<meta name="viewport" content="width=800">
		6	<style>
		7	body {
		8	width: 800px;
		9	margin: 0;
		10	overflow-y: hidden;
		11	}
		12
		13	#header form {
		14	font-size: 85%;
		15	display: inline;
		16	}
		17
		18	#header .links {
		19	font-size: 85%;
		20	}
		21
		22	ul.links {
		23	margin: 0;
		24	padding: 0;
		25	list-style-type: none;
		26	}
		27
		28	ul.links li {
		29	display: inline;
		30	white-space: nowrap;
		31	}
		32	</style>
		33
		34	</head>
		35	<body>
		36
		37	<div id="header">
		38	<ul class="links">
		39	<li>
		40	<a href="./">Home</a>
		41	</li>
		42	<li>
		43	<span>\| </span>
		44	<a href="">New</a>
		45	</li>
		46	<li>
		47	<span>\| </span>
		48	<a href="">Search</a>
		49	</li>
		50	<li>
		51	<span>\| </span>
		52	<form>
		53	<input class="txt" type="text" id="quicksearch_top" name="quicksearch">
		54	<input class="btn" type="submit" value="Find" id=find_top">
		55	</form>
		56	</li>
		57	<li>
		58	<span>\| </span>
		59	<a href="">Reports</a>
		60	</li>
		61	</ul>
		62	</div>
		63
		64	<div>
65	<p><div style="font-size: 2.5rem">
66	This test checks that form controls like buttons, text inputs and check-boxes are not autosized.
67	The text in this paragraph should be autosized, while the form controls above and below should not.
68	The "Find" button and text-input box at the bottom of the page should not be autosized.
69	</div></p>
70
71	<form>
72	<div>
73	<p><div style="font-size: 2.5rem">
74	This text should be autosized, while the input controls below should not.
75	</div></p>
76	<input id="quicksearch" type="text" name="quicksearch">
77	<input id="find" type="submit" value="Find">
78	</div>
79	</form>
80
81	</div>
82
83	</body>
84	</html>