diff --git a/components/layout/stylesheets/servo.css b/components/layout/stylesheets/servo.css
index ec368cd773b..5c93b1496c2 100644
--- a/components/layout/stylesheets/servo.css
+++ b/components/layout/stylesheets/servo.css
@@ -24,38 +24,40 @@ input::-servo-text-control-inner-editor {
pointer-events: auto;
}
+/* FIXME(#36982): Use `display: block; align-content: center` instead of flex. */
input::-servo-text-control-inner-container {
- position: relative;
- height: 100%;
- pointer-events: none;
display: flex;
+ height: stretch;
+ pointer-events: none;
+ position: relative;
}
input:not(:placeholder-shown)::placeholder {
- visibility: hidden !important
+ visibility: hidden !important;
}
input::-servo-text-control-inner-editor, input::placeholder {
- white-space: pre;
- margin-block: auto !important;
- inset-block: 0 !important;
block-size: fit-content !important;
+ min-width: stretch;
+ white-space: pre;
}
input::placeholder {
- overflow: hidden !important;
- position: absolute !important;
- color: grey !important;
+ color: grey;
+ inset-block: 0 !important;
+ margin-block: auto !important;
+ overflow: hidden;
pointer-events: none !important;
+ position: absolute !important;
}
input::color-swatch {
- width: 100%;
- height: 100%;
- display: inline-block;
box-sizing: border-box;
border: 1px solid gray;
border-radius: 2px;
+ display: inline-block;
+ height: 100%;
+ width: 100%;
}
input::selection,
diff --git a/tests/wpt/mozilla/meta/MANIFEST.json b/tests/wpt/mozilla/meta/MANIFEST.json
index 17d953609db..de12c35ad2c 100644
--- a/tests/wpt/mozilla/meta/MANIFEST.json
+++ b/tests/wpt/mozilla/meta/MANIFEST.json
@@ -169,6 +169,19 @@
],
{}
]
+ ],
+ "input-textual-text-align.html": [
+ "600a41cba133e9933132165e7cc4a2ea0ca28884",
+ [
+ "appearance/input-textual-text-align.html",
+ [
+ [
+ "/_mozilla/appearance/input-textual-text-align-ref.html",
+ "=="
+ ]
+ ],
+ {}
+ ]
]
},
"css": {
@@ -8154,6 +8167,10 @@
"d30f13a2a1bab16989ec585a57ba7b7bd0b1c329",
[]
],
+ "input-textual-text-align-ref.html": [
+ "c2c99bc0751afd0aea3479a54df5f1d107fff38d",
+ []
+ ],
"supports": {
"input-textual-ref.css": [
"7cdabb05d5dd7eb39df521fcb5ce24e39fea840f",
diff --git a/tests/wpt/mozilla/tests/appearance/input-textual-text-align-ref.html b/tests/wpt/mozilla/tests/appearance/input-textual-text-align-ref.html
new file mode 100644
index 00000000000..c2c99bc0751
--- /dev/null
+++ b/tests/wpt/mozilla/tests/appearance/input-textual-text-align-ref.html
@@ -0,0 +1,40 @@
+
+
+
+ Input Element's Text Could be Aligned Properly
+ Input Element's Text Could be Aligned Properly
+
+
+
+
+
+
+
+
+
+
+
+
+
+