C# Razor Adding Weird Suffix to Html Tags-CodePudding

I'm using .NET 7, Visual Studio 2022 and Razor Pages, fresh razor page template project. Something is injecting a suffix b-1cs0j1knof after many of my html tags. This happens even in release/published build. How do I disable this? Nothing comes up when searching online after a few hours so decided to post here. I am sure this is a feature that I could search easily if I knew the name...

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>SiteName</title>
</head>
<body>
    <header>
        <nav b-1cs0j1knof>
            <div b-1cs0j1knof>
            </div>
        </nav>
    </header>
    <div b-1cs0j1knof >
        <main b-1cs0j1knof role="main">
            
<h2>Home Page</h2>
        </main>
    </div>
    <br b-1cs0j1knof/>
    <footer b-1cs0j1knof>
        <div b-1cs0j1knof>
            &copy; 2022 - 2022 SiteName
        </div>
    </footer>
</body>
</html>

CodePudding user response：

TLDR; If you don't want this feature, add <ScopedCssEnabled>false</ScopedCssEnabled> to your csproj file.

From Reddit.

Those attributes are automatically generated by ASP.NET’s css isolation feature, which is enabled by default. This lets you create a *.razor.css file and add styling specific to your razor file without affecting the rest of the page. ASP.NET will process the css and add attribute selectors matching what you’re seeing on the rendered elements. See https://learn.microsoft.com/en-us/aspnet/core/blazor/components/css-isolation?view=aspnetcore-7.0