Ellipsis(...) for label in mozilla

Hi All,

I am trying to use ellipsis(…) for lable. Its getting displayed in IE for main window and subwindos also… And for mozilla, its working on main window but not for subwindows.

Please help me if you have any solution about this problem.

Hi,

AFAIK there are some browser specific CSS properties for that:


-o-text-overflow: ellipsis;
-icab-text-overflow: ellipsis;
-khtml-text-overflow: ellipsis;
-moz-text-overflow: ellipsis;
-webkit-text-overflow: ellipsis;

text-overlow: ellipsis; is only supported in Firefox 7 and up. For previous version, you need to use heavy handed CSS or resort to JavaScript/GWT to add the dots after the text. I did so in a customer project lately, but it only applied to one particular component, it’s not a global fix to the issue.

Thnx Alexander… But I have already tried above mentioned css properties. And as I said its working on main window but not for subwindows (pop up window).

Hi Jouni, I have used XBL and css to display ellipsis for label in firefox. And its working for main vaadin window. But its not working on subwindows as I mentioned above.

Can you paste here the exact css you are using (including the selector), maybe it is too strict for subwindows.
Sub windows are created outside of the app root, so you can’t select them with .v-app, .v-theme-mytheme or .v-app-myapp.

Hi Mathias,

I am using following css code:

.v-label-ellipsis
{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
-ms-text-overflow: ellipsis;
-moz-binding:url(ellipsis-xbl.xml#ellipsis);
}

And in vaadin I have called the css class as -
label.addStyleName(“ellipsis”);