Share via

Why is the blazor css isolation not working?

Haneen Al-fakhry 10 Reputation points
Feb 25, 2024, 9:05 PM

I have an AppLogin.razor component and its css file is AppLogin.razor.css. They are working fine. I have a UserLogin.razor component and its css file is UserLogin.razor.css. The working mechanism is as follows When you login from the AppLogin.razor component, it navigates to the UserLogin.razor component by NavigationManager route, but the problem is that it does not execute the css file for UserLogin.razor, but rather executes the css file for AppLogin.razor, even after moving to the UserLogin.razor component. What's the reason?

note : I have included this <link href="AssembleName.styles.css" rel="stylesheet">

.NET
.NET
Microsoft Technologies based on the .NET software framework.
3,951 questions
ASP.NET Core
ASP.NET Core
A set of technologies in the .NET Framework for building web applications and XML web services.
4,645 questions
Blazor
Blazor
A free and open-source web framework that enables developers to create web apps using C# and HTML being developed by Microsoft.
1,605 questions
ASP.NET
ASP.NET
A set of technologies in the .NET Framework for building web applications and XML web services.
3,521 questions
C#
C#
An object-oriented and type-safe programming language that has its roots in the C family of languages and includes support for component-oriented programming.
11,061 questions
{count} vote

1 answer

Sort by: Most helpful
  1. Bruce (SqlWork.com) 67,401 Reputation points
    Feb 26, 2024, 4:50 PM

    please read the docs until you understand how css isolation works:

    https://learn.microsoft.com/en-us/aspnet/core/blazor/components/css-isolation?view=aspnetcore-8.0

    then use the browsers CSS debug tools to see why the isolation selectors are not work as you expected


Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.