ModelProps not supporting Styles property in office ui fabric control dialog component.

[chowdam999]

 <Dialog

          hidden={hideDialog}

          onDismiss={this._closeDialog}

          dialogContentProps={{

            type: DialogType.normal,

            title: 'Missing Subject',

            subText: 'Do you want to send this message without a subject?',

          }}

          modalProps={{

            styles: { main: { maxWidth: 450 } },

            isModeless: true,

            dragOptions: isDraggable ? this._dragOptions : undefined,

            onDismissed: this._closeDialog,

          }}

        >

styles is not supporting on dialog box .

I want to give custom width and height to dialogBox.

[#2]

Hi,
Please try the below with width and height as 450.
<Dialog
hidden={hideDialog}
onDismiss={this._closeDialog}
dialogContentProps={{
type: DialogType.normal,
title: 'Missing Subject',
subText: 'Do you want to send this message without a subject?',
}}
maxWidth={450}
modalProps={{
styles: { main: { height: 450 } },
isModeless: true,
dragOptions: isDraggable ? this._dragOptions : undefined,
onDismissed: this._closeDialog,
}}
>

Hope it helps, please like it or mark it as a solution if it resolves ur clarification or issue
-Sudharsan K...

[#3 · Accepted solution]

@Sudharsan K 

Previously it supported :

modalProps={{
titleAriaId: this.labelId,
subtitleAriaId: this.subTextId,
isBlocking: false,
styles: { main: { height: 350, width: 500 } },
}}

Now its working with below code :

 modalProps={{

                        isBlocking: false,

                        styles: { main: { height: 700 } },

                    }}

                    minWidth={'1450px'}

[#4]

Hi,
Please choose the best response and close the discussion. It would help others to resolve their issues.