CODEWITHSUNDEEP
javahtmlcssspring-bootbootstrap-4
Leonid
Leonid

Reputation: 21

html page refused to apply style bootstrap.min.css

I am doing a project in Java using Spring Boot in the intellij idea under the management of Maven, and I occasionally have a problem with connecting bootstrap.min.css on the HTML page.

In my case, this problem arises spontaneously, and I could not determine its cause. Even now I have several absolutely identical projects, and in some of them this problem exists, and in others it has disappeared.

I connect bootstrap.min.css in the same way as on this page https://getbootstrap.com/docs/4.3/getting-started/introduction/

<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta http-equiv="x-ua-compatible" content="ie=edge">

    <title>LoginPage2</title>

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="/static/css/bootstrap.min.css"
          integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

when I go to the page in the browser, an error message is displayed in the console:

Refused to apply style from 'http://localhost:8081/static/css/bootstrap.min.css' because its MIME type ('application/json') is not a supported stylesheet MIME type, and strict MIME checking is enabled

Upvotes: 1

Views: 1325

Answers (3)

Bipil Raut
Bipil Raut

Reputation: 262

You can try this.

Add in your link tag two more attribute

type="text/css" media="all"

<link rel="stylesheet" href="/static/css/bootstrap.min.css"
          integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous" type="text/css" media="all">

Upvotes: 0

Leonid
Leonid

Reputation: 21

in my case it helped me:

  • replacing this code
<link rel="stylesheet" href="/static/css/bootstrap.min.css"integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

with this one

<link rel="stylesheet" href="/static/css/bootstrap.css">

  • remove all comments from files bootstrap.min.css and bootstrap.css

  • just in case, explicitly register the path to resources in the project with spring boot, for example:

@Configuration
public class StaticResourceConfig implements WebMvcConfigurer {
    private static final String[] CLASS_PATH = {"classpath:/"};

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/**").addResourceLocations(CLASS_PATH);
    }
}
  • If there is a spring security, then make sure that there is permission to the resources.

Upvotes: 1

Taskmaster
Taskmaster

Reputation: 78

If you are using local downloaded bootstrap in your PC then, remove integrity and crossorigin from your link. I think this is work for you.

Upvotes: 0

Related Questions