Make WordPress Core

Opened 5 weeks ago

Last modified 5 weeks ago

#61230 new defect (bug)

Check boxes have been broken(empty) for years in Firefox

Reported by: azxiana's profile azxiana Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: 6.5.3
Component: Administration Keywords: reporter-feedback
Focuses: ui Cc:

Description

In Firefox check boxes do not render a checked state when checked and has been this way for years.

This is because the "input[type="checkbox"], input[type="radio"]" CSS selector has "-webkit-appearance: none;" which as it says, removes the appearance of the check mark.

Attachments (5)

Screenshot 2024-05-16 200000.png (38.1 KB) - added by azxiana 5 weeks ago.
Screenshot 2024-05-16 203335.png (42.8 KB) - added by azxiana 5 weeks ago.
Screenshot 2024-05-16 203351.png (37.3 KB) - added by azxiana 5 weeks ago.
Screenshot 2024-05-16 203401.png (199.1 KB) - added by azxiana 5 weeks ago.
checkbox-before-win10.png (75.4 KB) - added by sabernhardt 5 weeks ago.
::before styles in Firefox 125.0.3/Windows 10, when the checked checkbox shows the SVG image

Download all attachments as: .zip

Change History (9)

#1 @azxiana
5 weeks ago

That first screenshot was an unintentional upload. ¯\_(ツ)_/¯

#2 @swissspidy
5 weeks ago

  • Component changed from General to Administration
  • Focuses css removed
  • Keywords reporter-feedback added

Hi there and welcome to WordPress Trac!

What device / OS is this on? I cannot reproduce this in Firefox on macOS. Checkbox appearance is just fine here in all states.

Also, if this is specific to WP Super Cache, you should report it there.

#3 @azxiana
5 weeks ago

Further testing reveals that this bug occurs on:
Firefox 126 on Windows 11
Firefox for Android 125.3 on Android 14
Ungoogled Chromium Portable 115 on Windows 11

This occurs on all check boxes including the login page. This is a fresh WordPress installation and the bug occurred before making any modifications.

This issue occurs with all plugins disabled.
There is one theme installed and activated, Twenty Twenty-Two.

Removing the CSS selector that I mentioned fixes the issue for me.

@sabernhardt
5 weeks ago

::before styles in Firefox 125.0.3/Windows 10, when the checked checkbox shows the SVG image

#4 @sabernhardt
5 weeks ago

That first screenshot was an unintentional upload.

I removed the copyright image. If that was wrong, please re-attach it.

When the checkbox is checked, what does the browser inspector show you for the ::before rules? The styles remove the -webkit-appearance but should replace it with an SVG in the ::before pseudo-element. Do you have additional styles (possibly from a browser extension) or else something crossed out?

Note: See TracTickets for help on using tickets.