Thymeleaf with Spring Boot - Cannot Find Static Assets (CSS)

Question

I am using the Thymeleaf template engine in my Spring Boot MVC application, but am having difficulty loading styless. The link is in the header.html file (located under resources/templates/fragments) and being referenced in login.html (under resources/templates). The stylesheet is located in the resources/static/css directory.

<head th:fragment="header">
    <link rel="stylesheet" href="../../static/css/bootstrap.css" th:href='@{/css/bootstrap.css}' />
</head>

login.html

<html>
<header th:replace="fragments/header :: header"></header>

<body class="container">

    <h1>Login page</h1>
   // Code omitted for brevity

  </body>

</html>

I have a very typical directory structure:

Based upon this question and other sources, is seems that application should be able to load the stylesheet using the specified link. However, this is not the case. Specifically, if I look in my browser's network tab, the request for the stylesheet returns a 302 (not a 404), but the styles are not applied. Furthermore, if I click "Style Editor" tab in Firefox, I receive a Stylesheet could not be loaded: http://localhost:8080/css/bootstrap.css message.

What might the issue be? Thanks.

Antoniossss Antoniossss · Accepted Answer · 2018-12-19T14:46:29

I think it should be

href="/static/css/bootstrap.css"

or even

href="static/css/bootstrap.css"

and in general this resource is available under

http(s)://yourdomain/yourApplicationRoot/static/css/bootstrap.css

As basicly this is the path that spring exposes static resources by default.

In your case, it will be @{static/css/bootstrap.css} (or with slash at the beginning)

Thymeleaf with Spring Boot - Cannot Find Static Assets (CSS)

2 Answers