react-bootstrap：ModalのdialogClassName小道具が機能しない

Question

私はdialogClassName小道具を使用して、Modalの幅を90％に変更しています。 CSSは何も変更しません。私はstyle.cssが他のすべてのクラスでうまく動作することを確認しました。

このSO questionのソリューションは機能しません。 documentationも機能しません。

私はあなたの助けに感謝します！

modal.js方法レンダリング：コードdialogClassNameがダイアログコンポーネントのクラス名を設定するために使用されているソースによれば

.main-modal { 
    width: 90%; 
} 

Answer 1

：

render() { 
    return (
     <div> 
     <CardMain openModal={this.handleOpen} 
        {...this.props} /> 

     <Modal 
      show={this.state.open} 
      onHide={this.handleClose} 
      dialogClassName="main-modal" 
     > 

      <ModalMain tabKey={this.state.tabKey} 
         {...this.props} /> 

      <FeedbackForm /> 
     </Modal> 
     </div> 
    ); 
    } 

のstyle.cssを。 dialogComponentプロパティをModalコンポーネントに渡すことができます。

あなたはModal docsにdialogComponentClassに次の行のdialogComponentの説明を読むことができます。