css - Extjs 消息框居中对齐

Question

正如标题所说，我希望 Ext.Msg.alert() 的消息居中对齐。我试过这个:

 Ext.Msg.alert({
        title: 'Success',
        msg: 'Deleted',
        buttons: Ext.Msg.OK,
        baseCls: 'msgbox'
    });

CSS:

 .msgbox {
      text-align: center;
  }

它仍然是左对齐。我该怎么做？

Answer 1

显示的文本是一个 displayfield 组件，它的大小与当时的文本相同，即使它居中，您也看不到它按您想要的方式对齐。

所以，解决办法就是让它变大。在我的示例中，我使用 css 类来完成。看看它:

var w = Ext.Msg.alert({
        title: 'Success',
        msg: 'Deleted',
        buttons: Ext.Msg.OK,
        autoShow: false,
        cls: 'msgbox'    
});

w.down('.displayfield' ).addCls('displayfield-fullsize');

正如您想象的那样，类(class)是:

.displayfield-fullsize{
       width: 100% !important;
}

在这里查看它的工作情况:http://jsfiddle.net/lontivero/F7HE3/3/