镜像站点 · 本页由第三方 GitHub 只读镜像提供,非 GitHub 官方站点,不接受任何登录或凭据输入。前往 github.com
Skip to content

Fix order-first and order-last for Firefox - #16266

Merged
RobinMalfait merged 3 commits into
mainfrom
fix/issue-16165
Feb 5, 2025
Merged

RobinMalfait merged 3 commits into
mainfrom
fix/issue-16165

Conversation

@RobinMalfait

Copy link
Copy Markdown
Contributor

This PR fixes an issue where order-last doesn't work as expected in Firefox.

The implementation of order-last, looks like this:

.order-last {
  order: calc(infinity);
}

Which is valid CSS, and calc(infinity) is even valid in Firefox. You can use this in other properties such as border-radius:

.rounded-full {
  border-radius: calc(infinity * 1px);
}

While this works, in properties like order it just doesn't work.

Fixes: #16165

The `calc(infinity)` is supposed to work in Firefox, and it does in
places like `rounded-full` which generate:
```css
.rounded-full {
  border-radius: calc(infinity * 1px);
}
```

But in places for `order`, it doesn't complain and is valid, yet it just
doesn't work.
@RobinMalfait
RobinMalfait requested a review from a team as a code owner February 5, 2025 09:38
@RobinMalfait
RobinMalfait merged commit 82d486a into main Feb 5, 2025
@RobinMalfait
RobinMalfait deleted the fix/issue-16165 branch February 5, 2025 11:04
@thecrypticace

Copy link
Copy Markdown
Contributor

We should probably file a browser bug for this

thecrypticace added a commit to tailwindlabs/tailwindcss.com that referenced this pull request Aug 18, 2025
The order-first/last utilities were changed to use `9999` instead of
infinity because of FF:
tailwindlabs/tailwindcss#16266

Closes #2338
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[v4] order-first/last not working in Firefox

3 participants