Question

I try adjust content auto dynamic into Ext.Msg.confirm, but i don’n try to adjust it. The remains Ext.Msg.confirm adjusted to the larger size of the content.

I have this code:

header

div.x-sheet.x-msgbox {
    width:15em;
    height:auto;
    background:#fff;
    -webkit-box-shadow: rgba(0,0,0,0.4)00.1em0.5em;
    -webkit-border-radius:0.3em;
    -moz-box-shadow: rgba(0,0,0,0.4)00.1em0.5em;
    -moz-border-radius:0.3em;
    border-radius:0.3em;
    border:0.15em solid #FFFFFF;
}

body

.x-msgbox-body {
    padding:40px0;
    padding:6px0;
    background-color:#ffffff;
    color:#094fa4;
    position:relative;
    margin:0auto;
    text-align: center;
    overflow: hidden;
}

Please help me.

Answer 1

Sencha will automatically adjust the size of the message box to amount of text. Do you want to override that?

If so, you can put the !important rule on the height definition to override sencha’s css markup for the message box (auto won’t really do anything though):

div.x-sheet.x-msgbox {
    width:15em;
    height:115px !important;
    background:#fff;
    -webkit-box-shadow: rgba(0,0,0,0.4)00.1em0.5em;
    -webkit-border-radius:0.3em;
    -moz-box-shadow: rgba(0,0,0,0.4)00.1em0.5em;
    -moz-border-radius:0.3em;
    border-radius:0.3em;
    border:0.15em solid #FFFFFF;
}