Important Notice - Forums is archived
To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
Layout sizing in a vaadin application
i am attempting to get some insight on how sizing should work in a vaadin application. I built a vaadin app using
px
to define all of my layouts, buttons and other components. This was a poor choice since now any screen size larger or smaller than the one i developed with creates a disformatted look. My question to any CSS Vaadin experts or layout editors is how do i properly define the width and height of components so that the view automatically adjusts depending on screen size?
My personal approach is the following :
- if something has a fixed size (logo, ...) use pixels
- if something has a fixed size on one axis, use pixels on that axis, percentage on the other (for example a toolbar which has a limited height but use all screen width)
- make everything else percentage based so that it flows well with screen size changes
In some cases fixed layouts are the best. For instance this forum is 966px wide, smaller screens have scrollbars, bigger screens have white space on left and right.
It all depends on what you want to do.