Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
Panel Rounded Border
Hi - Can someone tell me how to style a panel so that it has a rounded border? There is an example of this in the Book of Vaadin figure 6.6, which uses the style name "panelexample". However, the css class definition for "panelexample" is not listed (unless someone can point me to where to find this).
The figure in the book uses the Panel component with the old [tt]runo[/tt] theme that was the default theme in IT Mill Toolkit 5. Click the Runo screenshot in the themeing section of the demo to see what the theme looks like. It's got plenty of roundness.
There is no nice built-in way to make rounded border with CSS, but you have to compose the border using images of rounded corners. See the panel.css in the [tt]runo[/tt] theme for an example.
You could also search the web, there are plenty of tutorials on making rounded corners with CSS.
Marko Grönroos: You could also search the web, there are plenty of tutorials on making rounded corners with CSS.
Yes, and so far we have not found one working cross browser IE6+ to be usable. Some degrade fine to normal corners, other just mess up the whole layout.
Round corners (without images) is really a minefield for the moment.
Thanks for quick response, this helps to clarify!
It would have been nice if there was a built-in panel style with rounder corners similar to Reindeer.PANEL_LIGHT.