←back to thread

838 points bennettfeely | 4 comments | | HN request time: 0.685s | source
1. kuschku ◴[] No.22946194[source]
I’m impressed by how few people here have tested it in Firefox – Fieldset is broken, Button has ::-moz-focus-inner not properly disabled, Radio/Option isn’t rendering correctly (still shows the original input element as 2x2px black box), and quite a bit more.

Hilariously, this is quite a good example on why the Chrome monoculture is just repeating the IE monoculture of years past

replies(2): >>22946287 #>>22946313 #
2. tomxor ◴[] No.22946287[source]
I use FireFox, I don't think it's that bad... xbrowser native UI consistency is literally the hardest xbrowser thing to do.

Looking at firefox and chrome side by side it's actually impressive how they look near identical other than a few stray pixels.

3. prezjordan ◴[] No.22946313[source]
I’ve been getting a good amount of bug reports from FF users, and am grateful because - you are right - I did not test in it and should have.

I’m tracking the fieldset and inner-focus ones (though unable to repro the latter on my machine). The third is new to me if you’d be so kind as to share some details about your system.

replies(1): >>22954168 #
4. kuschku ◴[] No.22954168[source]
I’m running Firefox 75 on Ubuntu 18.04. Pretty standard usage.

Fieldset doesn’t allow inset box-shadows on Firefox, but you can fix that relatively easy:

    fieldset {
      position: relative;
    }

    fieldset::before  {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      box-shadow: inset -1px -1px #ffffff, inset 1px 1px #0a0a0a, inset -2px -2px #808080, inset 2px 2px #dfdfdf;
    }

Moz-Inner-Focus and the Radio/Options are also equally easily fixed:

    ::-moz-focus-inner {
      border: 0;
    }

    input[type="radio"], input[type="checkbox"] {
      visibility: hidden;
    }