WebKit Bugzilla
New
Browse
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
RESOLVED DUPLICATE of
bug 285114
284746
Nested CSS does not work with tailwind generated CSS
https://bugs.webkit.org/show_bug.cgi?id=284746
Summary
Nested CSS does not work with tailwind generated CSS
vincent.emonet
Reported
2024-12-16 06:13:39 PST
**Describe your issue** Using nested CSS to encapsulate Tailwind generated CSS does not work on Safari. But works exactly as expected on Firefox and Chromium. I tried a really basic nested CSS without tailwind (just rendering background-color) and it is working with safari, so the problem seems to be specifically with tailwind generated CSS (all nested CSS generated by tailwind seems to be ignored though...) I have also tried to generate tailwind CSS manually, and encapsulate it myself in the component, but still does not work on Safari (it works on firefox and chromium though) ```bash npx tailwindcss build -o temp.css && echo \".my-component {\" > src/style.css && cat temp.css >> src/style.css && echo \"}\" >> src/style.css && rm temp.css ``` Have you ever meet this problem? Is there a known fix? Imo it seems more like an issue with Webkit not properly implementing the nested CSS standard than TailwindCSS, but maybe Tailwind is doing some non standard things? **What build tool are you using?** ```json "autoprefixer": "^10.4.20", "postcss": "^8.4.49", "tailwindcss": "^3.4.16", "vite": "^6.0.3", "vite-plugin-solid": "^2.11.0", ``` **What version of Node.js are you using?** v20.17.0 **What browser are you using?** Safari 18.0.1 (that is not what I use to build the package, but it is the browser where the issue happens, I use ubuntu 22.04 to build) **Reproduction URL**
https://play.tailwindcss.com/zBXvzTRl77
Needs to be opened with Safari browser. Works all fine on firefox and chromium You can find an example of fully generated problematic nested CSS (after tailwind CSS build) in my project:
https://github.com/sib-swiss/sparql-llm/blob/2edd798f606e6bc837a0d3408418545da60f70a1/chat-with-context/src/style.css#L1
Attachments
Add attachment
proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1
2024-12-17 14:16:14 PST
<
rdar://problem/141639656
>
Matthieu Dubet
Comment 2
2025-01-22 08:31:38 PST
*** This bug has been marked as a duplicate of
bug 85114
***
Matthieu Dubet
Comment 3
2025-01-22 08:32:08 PST
*** This bug has been marked as a duplicate of
bug 285114
***
Matthieu Dubet
Comment 4
2025-01-22 08:33:20 PST
Thank you for the detailed report
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug