Grid multi line cells


in general every item inside a Table or Grid has one line. When you use Table you could do this workaround.




.make-it-multicell {
  .v-table-cell-wrapper {

So because I want to show long textes inside a table sometimes I tried to extend my scss like

.make-it-multicell {
  .v-table-cell-wrapper, .v-grid-cell {
  .v-grid-cell {
     overflow: normal;

But it keeps being cut off. Do you know a way to handle this?

Thanks a lot!


if there is no solution… Is there a way to show overlapping text with the title attribute? At the moment when I set grid.setWidth(“100%”) there are cells with cut off text and there is no way to see the hidden text except inspecting the html with firebug.

I get this to work by adding a ColumnGenerator() that returns a Label in HTML mode, overridding an existing column (announcement- bound from a container) as follows:

tableBulletin.addGeneratedColumn(“announcement”, new ColumnGenerator() {
private static final long serialVersionUID = -6366260307115844619L;
public Object generateCell(Table source, Object itemId,
Object columnId) {
Label label = new Label((String) source.getItem(itemId)
.getItemProperty(columnId).getValue(), ContentMode.HTML);
return label;

width is set to 100% and I also make sure expandRatio on that colum is set to 1 as well (…
.setColumnExpandRatio(“announcement”, 1.0f);
) so that it takes up any available horizontal space after other columns rendered.

Hey David,

thanks for your answer. But unfortunately your workaround is made for Table. I was looking for a possibility to create multi line cells for Grid.

If you want to line break your cells, you easily can do this with CSS as I showed it in my first post. But thanks a lot for your interest :slight_smile: