Isolated CSS Files are not applied, unable to restore behaviour that originally worked with CSS files

[codeputer]

Is there an existing issue for this?

• I have searched the existing issues

Describe the bug

The CSS bundle appears to exist and load, but the browser does not apply the styles. If the same rules are applied to an inline style or a global stylesheet (site.css), the styles work.

This setup worked earlier in the same project and stopped working while fixing other bugs. I have not been able to restore the previous behaviour. When creating a new project, they will work as well.

Environment

• .NET: 10.0 (Blazor United style project)
• Rendering: Interactive server
• Browser: Microsoft Edge (and others, same result)
• Project: Blazor app with isolated CSS (Component.razor + Component.razor.css)

Program.cs (simplified)

if (app.Environment.IsDevelopment())
{
    app.UseStaticFiles();
}
else
{
    app.MapStaticAssets();
}

app.MapStaticAssets();

app.MapRazorComponents<App>()
   .AddInteractiveServerRenderMode();

Repro steps

1. Create a Blazor United project on .NET 10.
2. Add a component with isolated CSS, for example:
   1. Home.razor
   2. Home.razor.css
3. Run the app in Development.
4. Open the page that uses Home.razor.
5. Inspect the page in devtools.
   1. The scoped CSS bundle appears present in the project output.
   2. The CSS file seems to load.
6. The component renders without the expected isolated styles.
7. Move the same CSS rules from Home.razor.css into:
   1. Inline style on the element, or
   2. A global stylesheet (site.css).
8. Reload the page.
9. Styles now apply as expected.

Expected Behavior

Expected behavior

• Isolated CSS (Component.razor.css) should apply to the matching component when the page loads, both in Development and Production.
• If the CSS file loads and the rules are valid, the component should render with the isolated styles, without requiring inline or global CSS as a workaround.

Steps To Reproduce

1. Create a Blazor United project on .NET 10.
2. Add a component with isolated CSS, for example:
   1. Home.razor
   2. Home.razor.css
3. Run the app in Development.
4. Open the page that uses Home.razor.
5. Inspect the page in devtools.
   1. The scoped CSS bundle appears present in the project output.
   2. The CSS file seems to load.
6. The component renders without the expected isolated styles.
7. Move the same CSS rules from Home.razor.css into:
   1. Inline style on the element, or
   2. A global stylesheet (site.css).
8. Reload the page.
9. Styles now apply as expected.

Exceptions (if any)

None found

.NET Version

10

Anything else?

the isolated CSS files were working, and something happened that caused them to stop working. I have worked at this for at least 8 hours - rebooting, remove obj/bin directors, browser hard refresh and cache, deployed to Azure, all resulted in no CSS being applied.

• Scoped CSS output exists under obj/Debug/net10.0/scopedcss.
• The issue looks like a regression in how isolated CSS is wired into the pipeline or referenced from the rendered page.
• I am open to running additional diagnostics, for example exact HTML link tags or network details, if guidance is provided.

[codeputer]

I'm sure this is what you want, but its not what I need.

Has there been any other issues with isolated CSS files, the coordination between razor and the css is failing during runtime. How can I look review this process to understand why the browser is not tying the html output with the CSS?

[javiercn]

@codeputer thanks for contacting us.

Without an actual repro project as a public GitHub repository we can't investigate. We don't have reports of anything broken in this area and we have automation and E2E tests that cover scoped CSS. Based on the lack of other reports for such a popular feature, we are inclined to believe that there is something on your environment that is causing the problem.

The best way to investigate any issue here is tracing the build using something like MSBuild Structured log viewer and checking out the different files the framework generates to understand what's happening.

[codeputer]

I have spent so many hours on this, which was working, and now its not. My fear is that a subset of the project will be working, and I spent a lot of time on a "repo" that has no value. There is an edge case here, and I need to find out what is causing it. I've looked at both the razor and the CSS files sent to the browser, and everything seems to line up. The issue is that the CSS isn't working to style the page. I have a workaround: not to use the isolated CSS feature, but that too is a lot of work across the application. I would like to know if it is around line endings, as I work in Windows and deploy to Linux. R

…

________________________________ From: Javier Calvarro Nelson ***@***.***> Sent: November 18, 2025 3:48 AM To: dotnet/aspnetcore ***@***.***> Cc: Richard Reukema ***@***.***>; Mention ***@***.***> Subject: Re: [dotnet/aspnetcore] Isolated CSS Files are not applied, unable to restore behaviour that originally worked with CSS files (Issue #64390) [https://avatars.githubusercontent.com/u/6995051?s=20&v=4]javiercn left a comment (dotnet/aspnetcore#64390)<#64390 (comment)> @codeputer<https://github.com/codeputer> thanks for contacting us. Without an actual repro project as a public GitHub repository we can't investigate. We don't have reports of anything broken in this area and we have automation and E2E tests that cover scoped CSS. Based on the lack of other reports for such a popular feature, we are inclined to believe that there is something on your environment that is causing the problem. The best way to investigate any issue here is tracing the build using something like MSBuild Structured log viewer and checking out the different files the framework generates to understand what's happening. — Reply to this email directly, view it on GitHub<#64390 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AAEVJVOKCXARKNYQD7QNS5L35L2OVAVCNFSM6AAAAACMJST2OWVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZTKNBWHA4DIMRUGU>. You are receiving this because you were mentioned.Message ID: ***@***.***>

[javiercn]

@codeputer thanks for the additional details.

Unfortunately, without a repro the best we can do is point you to the suggestions that we mentioned above. All the places involved in scoped CSS are:

• Checking the binlog to make sure that the scope CSS is being generated for your file.
• Checking the generated bundle to understand if the scoped CSS is there.
• Ensuring that the server is returning the right response for the CSS.
• Ensuring that the markup contains the scoped CSS attributes.
• Ensuring that the transformed markup looks correct.
• Ensuring that the transformed rules look correct.

One thing that I don't understand is why you have. It should just have app.MapStaticAssets() all the time. That said, it shouldn't affect anything.

if (app.Environment.IsDevelopment())
{
    app.UseStaticFiles();
}
else
{
    app.MapStaticAssets();
}