Closed Bug 1708063 Opened 6 months ago Closed 6 months ago

Firefox permits whitespace between `>` and `=` on CSS media queries

Categories

(Core :: CSS Parsing and Computation, defect)

Firefox 86
defect

Tracking

()

RESOLVED FIXED
90 Branch
Tracking Status
firefox90 --- fixed

People

(Reporter: tbjgolden, Assigned: emilio)

Details

Attachments

(2 files)

Attached file firefox-bug.html

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:86.0) Gecko/20100101 Firefox/86.0

Steps to reproduce:

Create a HTML page as follows, note the space between < and = in the media query.

<html><head></head><body>
<style>
  @media (width < = 10000px) {
    body {
      background: black;
    }
  }
  </style>
</body></html>

Actual results:

The page is black - the media query was (incorrectly) considered valid

Expected results:

The page should not be black - the media query should have been ignored.

This is explicitly mentioned by the spec:

https://www.w3.org/TR/mediaqueries-4/#mq-syntax

"No whitespace is allowed between the “<” or “>” <delim-token>s and the following “=” <delim-token>, if it’s present."

The Bugbug bot thinks this bug should belong to the 'Core::CSS Parsing and Computation' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Component: Untriaged → CSS Parsing and Computation
Product: Firefox → Core
Severity: -- → S3
Status: UNCONFIRMED → NEW
Ever confirmed: true

Nice catch!

Assignee: nobody → emilio
Pushed by ealvarez@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/268a8fd76e9a
Don't allow whitespace between media query operator delim tokens. r=boris
Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/28780 for changes under testing/web-platform/tests
Status: NEW → RESOLVED
Closed: 6 months ago
Resolution: --- → FIXED
Target Milestone: --- → 90 Branch
Upstream PR merged by moz-wptsync-bot
You need to log in before you can comment on or make changes to this bug.