Vaadin Java: Import problem with css file

I´m working on the Vaadin Tutorial series part 8


Text Version:

Therefore I´m struggling with the last step of importing the given css file. I do exactly the same as in the tutorial shown but the form style doesn´t change. It seems the css file is not working.

Vaadin Version 14.4.2

My Project folder incl. MainView:

enter image description here

CSS File:

/* List view */
.list-view .content {
    display: flex;

.list-view .contact-grid {
    flex: 2;

.list-view .contact-form {
    flex: 1;
    padding: var(--lumo-space-m);

@media all and (max-width: 1100px) {
    .list-view.editing .toolbar,
    .list-view.editing .contact-grid {
        display: none;

My WebApp

enter image description here

Should be like this:

enter image description here

Read more here:

Content Attribution

This content was originally published by Maiwand at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: