I have not been able to find any entries for v-table-cell-content-???

I did find . -exec grep "v-table-cell-content" {} \; -print at the top level of vaadin download.

I am searching for the available cell styles and row styles for tables.

Does anyone know where I can find these?

I know from the sampler demo that red, green, blue are available.

Or does anyone have an example of either v-table-cell-content-??? or v-table-row-content-???

Escuse me if i didn’t understand your question perhaps.
Firefox’s Firebug reports when pointing to a table cell (reindeer theme is packed with vaadin jar, where you can find syles.css - vaadin-6.4.0\WebContent\vaadin-6.4.0.jar\VAADIN\themes\reindeer):

From the book of vaadin

The Table.CellStyleGenerator interface allows you to set the 
CSS style for each individual cell in a table. 
You need to implement the getStyle(), 
which gets the row (item) and column (property) identifiers 
as parameters and can return a style name for the cell. 
The returned style name will be concatenated 
to prefix "v-table-cell-content-". 

I am looking for a way to find all the predefined v-table-cell-content-?? table cell styles and an example of at least one if possible

Those styles are defined in the Sampler theme, and are not part of the built-in themes (Reindeer and Runo).

There are no predefined table cell/row/column styles available, you need to define them in your own theme.

Hi Jouni,

Is it possible to use different row height for a Table/TreeTable?
What I want is: one, to change the height of a Table row by its cells dynamically, E.g via the content size of the text in that cell. Second, to wrap the content of the cells into lines if it is longer than available in the current column.

Do you think they are possible with vaadin? Any suggestion, direction… or workaround?

Thx & BR ;-D


This is possible, but it will make the lazy loading behavior of the Table unpredictable. The scrolling relies on the assumption that all rows are equal height, in order to approximate the item index when scrolling.

But you can disable the lazy loading by setting the pageLength attribute of the table to zero: table.setPageLength(0). This will force the table to render all rows straight away.

To make the rows expand with their content, you need to use CSS. Set the height of the rows to “auto”, and override any “white-space:nowrap” declarations from inside the rows, and the text should wrap is intended. Note, though, that column width calculations might become unpredictable, and you may need to specify either fixed column widths or expand ratios, or both.

Thanks for the fast answer, I am going to try…

could I ask how to override white-space:nowrap?
Thank you so much,