Bug 1673895 - Allow customizing the spacing between the button and the label of a file input. r=TYLin

This should have no behavior changes, but allows authors to customize
the amount of spacing between the label and the button of a file control
by applying it as margin of the file selector pseudo rather than as
padding of the label.

Differential Revision: https://phabricator.services.mozilla.com/D95620
This commit is contained in:
Emilio Cobos Álvarez 2020-11-03 21:47:04 +00:00
Родитель 6e81f21951
Коммит 66310920d1
3 изменённых файлов: 13 добавлений и 1 удалений

Просмотреть файл

@ -676,7 +676,6 @@ input[type="file"] {
input[type="file"] > label { input[type="file"] > label {
display: inline-block; display: inline-block;
min-inline-size: 12em; min-inline-size: 12em;
padding-inline-start: 5px;
text-align: match-parent; text-align: match-parent;
color: unset; color: unset;
@ -692,6 +691,7 @@ input[type="file"] > label {
font-size: unset; font-size: unset;
letter-spacing: unset; letter-spacing: unset;
cursor: unset; cursor: unset;
margin-inline-end: 5px;
} }
/* /*

Просмотреть файл

@ -0,0 +1,2 @@
<!doctype html>
<input type=file>

Просмотреть файл

@ -0,0 +1,10 @@
<!doctype html>
<title>CSS Test: margin can be used to shrink the spacing betwee the file selector button and its label</title>
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1673895">
<link rel="mismatch" href="file-selector-margin-notref.html">
<style>
::file-selector-button {
margin: 0;
}
</style>
<input type=file>