Simple CSS Class injection isn't working

I want to set the CSS background property of a Vaadin Flow Div element with text as content.

Direct CSS property manipulation works fine

Next step - CSS class injection, but no method is working for me. What is wrong?

with best regards

/* frontend/styles/test.css */
.blog {

Inside the main class no method for class injection is working

public class MainView extends VerticalLayout  {
	Div f = new Div();
	f.getElement().setProperty("innerHTML", loreIpsum);
	// div.getStyle().set("background-color","yellow"); - WORKS FINE
	f.setClassName("blog"); // DO NOT WORK
    // f.getElement().setAttribute("class","blog"); // DO NOT WORK
    // f.getElement().getClassList().add("blog"); // DO NOT WORK

Have you checked with Chrome developer tools network tab that the Browser succesfully loads test.css, i.e. there is no 404 there?

Thanks - you are right - the test.css is not loaded.


Trying to load the css directly

Could not navigate to 'frontend/styles/test.css'
Reason: Couldn't find route for 'frontend/styles/test.css'

Available routes:
This detailed message is only shown when running in development mode.

Problem solved.


instead of


works for me!