Blazor css file not updating when app is launched-CodePudding

I was adding some custom CSS from bootstraps website into my app.css file in Blazor however, while the file is edited in visual studio and saved. When the app launches and loads app.css it loads the older version of app.css without my changes. Would anyone know why this would be occurring? Thanks in advance

Edited CSS file

// ... some more css above....

.b-example-divider {
    height: 3rem;
    background-color: rgba(0, 0, 0, .1);
    border: solid rgba(0, 0, 0, .15);
    border-width: 1px 0;
    box-shadow: inset 0 0.5em 1.5em rgb(0 0 0 / 10%), inset 0 0.125em 0.5em rgb(0 0 0 / 15%);
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}
#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

Application load app.css

Missing .b-example-divider and just loading the document as it was before my change

CodePudding user response：

If you are not seeing changes that you have applied to the app.css file, you may need to clear your browser cache, manually.

A better solution is to use versioning as shown below:

<link rel="stylesheet" type="text/css" href="css/app.css?version=0.1">

Add a version number as a query parameter. This will force the browser to look for the latest version of the style sheet ...

CodePudding user response：

Browsers cache files. Where and how have you declared a link to this file?