Make WordPress Core

Opened 18 months ago

Closed 7 months ago

#61230 closed defect (bug) (duplicate)

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

Reported by: azxiana's profile azxiana Owned by:
Milestone: Priority: normal
Severity: normal Version: 6.5.3
Component: Administration Keywords: reporter-feedback close
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 18 months ago.
Screenshot 2024-05-16 203335.png (42.8 KB) - added by azxiana 18 months ago.
Screenshot 2024-05-16 203351.png (37.3 KB) - added by azxiana 18 months ago.
Screenshot 2024-05-16 203401.png (199.1 KB) - added by azxiana 18 months ago.
checkbox-before-win10.png (75.4 KB) - added by sabernhardt 18 months 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 (13)

#1 @azxiana
18 months ago

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

#2 @swissspidy
18 months 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
18 months 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
18 months ago

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

#4 @sabernhardt
18 months 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?

#5 @vyasnaman
8 months ago

I was not able to reproduce the issue on Android as well.

I tried on following devices:

  • Realme 6
  • Samsung S23

#6 @sabernhardt
8 months ago

  • Keywords close added

I think we need to know what Firefox shows you when you inspect the checkbox's ::before pseudo-element. It is difficult to move the ticket forward without that information.

#7 @sabernhardt
7 months ago

If images are turned off, that issue was reported in #55768.

#8 @sabernhardt
7 months ago

  • Milestone Awaiting Review deleted
  • Resolution set to duplicate
  • Status changed from new to closed

I think turning images off is the most likely situation for this to happen (with Twenty Twenty-Two and with zero active plugins), so I will close as a duplicate of #55768.

If I am wrong about that, please give more details.

Note: See TracTickets for help on using tickets.