I implemented a Bootstrap theme using Blazor. Everything seems to work properly, except when I navigate to a new page or use hot reload in Visual Studio. In those cases the css seems to break a bit (but not massively). A reload fixes it. Does anybody have any idea how I can fix this or figure out what’s going on?

This is what it normally looks like:

And this is what it looks like after a hot reload or page navigation:

So it’s less wide and the icons and positioning are getting messed up.

I don’t see any errors or warning in the console.

I have the blazor script at the very end of the body tag:

    <script src="_framework/blazor.web.js"></script>
</body>

I created the project using the Blazor Web App template, using .NET 8. “Interactive render mode” is set to “Server” and “Interactivity location” to “Per page/component”.

I’m unfortunately unable to share my git repository, since I’m using a paid Bootstrap theme, which doesn’t allow me sharing it.