haikuwebkit/LayoutTests/fast/forms/select-empty-size.html

<html>
<head>
<style>

select {
    height: 50px;
    border: 1px solid black;
    border-radius: 0px;
}

</style>
</head>
<body>
<select size>
<option>California</option>
</select>
</body>
</html>
[macOS] Text inside form controls is off center on burton.com https://bugs.webkit.org/show_bug.cgi?id=220376 <rdar://problem/72833977> Reviewed by Devin Rousso. Source/WebCore: <select> elements on burton.com specify an empty size attribute. This results in the "select:matches([size], [multiple]), select[size][multiple]" ruleset being applied, which adds the rule "align-items: flex-start". That rules causes the text within the element to be aligned to the top. This rule is necessary for <select multiple> and <select> elements with a size attribute greater than or equal to 2, which both have a listbox appearance (a popup menu is not shown when clicking the element). However, <select> elements with a size attribute less than or equal to 1 have a menulist appearance and display a popup when clicked. <select size> also displays a popup when clicked, and like other browsers it should have vertically centered text. WebKit already has an additional ruleset for size="0" and size="1" to preserve the menulist appearance. Consequently, we can augment the ruleset to include size="", removing the "align-items: flex-start" rule for <select size> and ensuring the text is vertically centered. Test: fast/forms/select-empty-size.html * css/html.css: (select:is([size], [multiple]), select[size][multiple]): Update ruleset to use :is(), instead of the obsolete :matches(). (select:is([size=""], [size="0"], [size="1"])): Add [size=""] to the list of matching attributes, since <select size> should not have a listbox appearance. The new appearance matches Chrome and Firefox. LayoutTests: Added a test to verify that the appearance of a <select> element with an empty size attribute is the same as one without a size attribute. * fast/forms/select-empty-size-expected.html: Added. * fast/forms/select-empty-size.html: Added. Canonical link: https://commits.webkit.org/232814@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@271218 268f45cc-cd09-0410-ab3c-d52691b4dbfc 2021-01-06 23:45:44 +00:00			`<html>`
			`<head>`
			`<style>`

			`select {`
			`height: 50px;`
			`border: 1px solid black;`
			`border-radius: 0px;`
			`}`

			`</style>`
			`</head>`
			`<body>`
			`<select size>`
			`<option>California</option>`
			`</select>`
			`</body>`
			`</html>`