Yii2モーダル高さの問題

Question

私は何らかの形でブートストラップモーダルを使用しています。私はモーダルを作成するチュートリアルthisから学んだ。私の以前のプロジェクトでは、このモーダルには何の問題もありませんでした。しかし、私の現在のプロジェクトでは、モーダルボディはモーダルコンテンツを完全にカバーしていません。ここにスクリーンショットがあります 私は今この問題をthisを参照して解決しました。私は高さの問題を引き起こす可能性があることを理解することができません。

マイビューファイルのコード

<div class="collection-type-index"> 



<h1><?= Html::encode($this->title) ?></h1> 
<?php // echo $this->render('_search', ['model' => $searchModel]); ?> 

<p> 
    <?= Html::button('Create Collection', ['value' => Url::to('index.php?r=settings/collectiontype/create'), 'class' => 'btn btn-success', 'id' => 'modalButton']) ?> 
</p> 

     <?php // Modal for create 
      Modal::begin([ 
        'header'=>'Collection Type', 
        'id'=>'modal', 
        'size'=>'modal-lg', 
      ]); 

      echo "<div id='modalContent'></div>"; 

      Modal::end(); 

    ?> <!-- end modal --> 

<?= GridView::widget([ 
    'dataProvider' => $dataProvider, 
    'filterModel' => $searchModel, 
    'columns' => [ 
     ['class' => 'yii\grid\SerialColumn'], 

     'id', 
     'type', 
     'days', 
     'created_by', 
     'modified_by', 
     // 'status', 

     ['class' => 'yii\grid\ActionColumn'], 
    ], 
]); ?> 

私は私が解決してきた言ったように私のコントローラはアクションコード

public function actionCreate() { 
     $model = new CollectionType(); 

     $model->created_by = Yii::$app->user->identity->username; 
     if ($model->load(Yii::$app->request->post()) && $model->save()) { 
      return $this->redirect(['view', 'id' => $model->id]); 
     } else { 
      if (Yii::$app->request->isAjax) { 
       return $this->renderAjax('create', ['model' => $model]); 
      } else { 
       return $this->render('create', ['model' => $model]); 
      } 
     } 
} 

そして、私のJSコード

$(function(){ 
$('#modalButton').click(function(){ 
    $('#modal').modal('show') 
     .find('#modalContent') 
     .load($(this).attr('value')); 
}); 

$('#modal').on('show.bs.modal', function() { 
    $('.modal-lg .modal-content').css('height',$(window).height()*0.55); 
}); 
}); 

を作成私たちの問題上記のjsスクリプトを使用していますが、これはすべてのモーダルで手動で高さを設定する必要があるため、これが最適な解決策ではないと私は考えています。この問題の原因は何ですか？誰もこの問題に直面して解決しましたか？

Answer 1

これは浮動小数点の問題のようです。モーダル内に生成されたビューを変更します。

このモーダルの内容を<div class="clearfix">と</div>の間にラップします。

OR

は、このビューの終わりに<div class="clearfix"></div>を追加します。