How can I change the font size of a label in vaadin in a layout-engine-friendly fashion? -

say have label:

label mylabel = new label(_("i smaller normal text")); mylabel.setsizeundefined(); 

(where _ favorite localization function).

i'd smaller usual. since there no ad-hoc label method accomplishing must resort adding "raw" css rules, example so:

cssinject csssmall = new cssinject(".small { font-size: small; }"); mypage.addcomponent(csssmall); mylabel.addstylename("small"); mypage.addcomponent(mylabel); 

that sort of works. yes, text is smaller, when page first built, vaadin sizes label if font regular sized. when causes page repainted/relaid out, vaadin realizes what's going on , gives correct size label.

this causes page "jump" noticeably label becomes both shorter , not tall.

how can work around this?

since situation seems desperate , themes no option wrap content label in html (make class, if need more once).

it (this groovy, it's easy translate java or whatever using:

new label("<span style='font-size:small'>${stringescapeutils.escapehtml4('&somesmalltext')}<span>").with{     contentmode = contentmode.html     } 

the key here escape text, wrap in html, , use contentmode.html label.

the "proper" way handle have theme, add your:

 .v-label.small { font-size: small } 

there, , set style on lable:

  mylabel.addstylename("small")