Nico Müller
Nico Müller

Reputation: 1874

Vaadin layout break line without panel

I know it is possible for labels to automatically break lines when in a panel. Is there a way to have labels break lines when the text would be over a layouts width?

UPDATE OK i tried it with "800px" width now instead of "100%" and now the labels are having line breaks. Whats the reason for this behaviour? And how can I workaround this then for a percentual sizing of layouts as this is important for my page?

It currently looks like in the image below, the text is just cut off.

It currently looks like this

Extracted Code showing the setup:

    VerticalLayout labelLayout= new VerticalLayout();
    labelLayout.setWidth("100%");
    labelLayout.addComponent(usernameLabel);
    labelLayout.addComponent(postLabel);
    labelLayout.addComponent(ratioLabel);
    labelLayout.addComponent(lowestRatedPost);
    labelLayout.addComponent(highestRatedPost);

    detailsLayer.addComponent(labelLayout);
    wrappercontent.addComponent(detailsLayer);
    wrapper.addComponent(wrappercontent);

Upvotes: 1

Views: 3137

Answers (1)

Chris M
Chris M

Reputation: 1068

I had exactly this problem, and managed to solve it using this CSS. Vaadin Labels have the CSS attribure white-space: nowrap which is what is stoping your text wrapping as you expect it to.

.v-label
{
   white-space: normal;
}

Upvotes: 4

Related Questions