css - 在 EXTJS 中包装标签

Question

我无法在 extjs 中包装标签。我需要动态设置值，当值太长时，它会破坏布局（在我的情况下是表格布局）。

以下是我使用的代码：

{
    xtype: 'label',
    text: 'Bla bla bla bla bla',
    labelWidth: 20, //had tried width as well, but no use
    labelAlign: 'left',
    autoWidth: false,
    boxMinWidth: 10,
    boxMaxWidth: 20,
    colspan: 1,
    margin: '50 50 50 50'
}

我也尝试过修改默认的 extjs css 文件。添加了CSS

.x-form-label{
   white-space:normal
}

在ext-theme-classic-all.css但没有用。

请帮忙。

Answer 1

在面板内包装长标签文本时，在 4.2.1 中对我有用的是：

{
    xtype: 'label',
    width: '100%',
    text: 'xxxxxxxxxxxxx yyyyxx xxxx xxxx xxxxx xxxxx aaaa bbbb cccc dddd xxxxxxxxxxxxx yyyyxx xxxx xxxx xxxxx xxxxx aaaa bbbb cccc dddd ',
},

在我的 Chrome、FF 和 IE11 应用中看起来像这样：

Answer 2

这适用于 Webkit。

---

{
    xtype: "label",
    id: "specificLabel"
}

---

.x-form-label#specificLabel {
    width: 20px;
    overflow: hidden;
}