diff options
| author | Emilio Cobos Álvarez <emilio@crisal.io> | 2020-03-29 05:16:32 +0200 |
|---|---|---|
| committer | Emilio Cobos Álvarez <emilio@crisal.io> | 2020-03-29 05:34:27 +0200 |
| commit | 387de38b48b47af5875750bc949c299fa5dc39b9 (patch) | |
| tree | e139c3968c49cc465b25578de6e7c97e741a0060 /pages | |
| parent | Proactively remove Twitter service worker (diff) | |
| download | libredirect-387de38b48b47af5875750bc949c299fa5dc39b9.zip | |
Fix overflowing inputs on some platforms.
`width: 100%` sets the content-box width, unless the box-sizing value is `border-box`, see: https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing (`box-sizing: border-box` is already the default for `<select>`). In platforms with more padding by default on inputs (like Firefox on Linux for example) this can cause the inputs to overflow the popup. Also shrink the padding manually to what the popup layout expects, so that it doesn't grow past the popup. Additionally we remove the appearance from checkboxes so that they don't take up space. This fixes https://bugzilla.mozilla.org/show_bug.cgi?id=1625716.
Diffstat (limited to 'pages')
| -rw-r--r-- | pages/styles.css | 8 |
1 files changed, 8 insertions, 0 deletions
diff --git a/pages/styles.css b/pages/styles.css index a68d9bbc..003c32e5 100644 --- a/pages/styles.css +++ b/pages/styles.css @@ -86,11 +86,19 @@ footer a.button { input[type=url], select { width: 100%; + box-sizing: border-box; margin-bottom: 5px; } +input[type=url] { + padding: 1px 2px; +} + input[type=checkbox] { opacity: 0; + -moz-appearance: none; + -webkit-appearance: none; + appearance: none; } .checkbox-label { |