Field Label with long text value grows beyond 'LabelWidth' property of formpanel

[DougMcDonald]

Hi All,

I have a problem pretty much described by the topic title, I have a combo box with a long field label value 'asdfhkgasdgfafsdafgasdbfkbasdjkfvbkasdfadsfafsdtg f6345634635656' for example.

My formpanel has a LabelWidth property defined as 200, but this long field name is not restricted to this width. As a result, my combobox is either squashed over and not in line with the rest of the form, or doesn't display at all (depending on the length of the field label).

I've tried setting the combo box label width to 200 explicitely or applying a LabelStyle of say "width: 200px; overflow: hidden;" but these don't seem to have any effect.

Are there any recommended ways to handle long field labels? (the problem we have here is that the user can define their own label, so we can't control the length, as rigidly as we'd like).

Any pointers would be great,

Many thanks,

Doug

[DougMcDonald]

Just as a followup, we're seeing this behaviour on both IE6 and IE8, attached is a screenshot showing how all our other fields align to the 200 width we've assigned to the form, but the field with a long label overflows and causes the combo not to display:




Any ideas?

[DougMcDonald]

Just as a final update to this post, we got round this issue by identifying the default CSS being applied to the field label and setting the following properties:

.x-form-item-label 
{
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: normal;
}

This prevents the default auto expanding property and as a result fixed the layout issue we saw, just in case this helps anyone else,

Cheers,

Doug

[Daniil]

Hi,

Yes, "ellipsis" is a good solution I can see.

Unfortunately, "ellipsis" is not working under FF, it's a FF bug or not implemented feature.

[DougMcDonald]

Hi Daniil,

Oh yeah, forgot to mention that I think ellipsis is an IE specific property, I guess the css won't validate either!

Fortunately our client is limited to IE so we're able to use it, might be worth investigation alternative solutions for others if you think a solution for this problem may benefit Ext users as a whole, up to you guys :)

Cheers,

Doug