bootstrap模態窗口動態寬度與最大值？

我有一個引導模式窗口，我需要根據顯示的內容動態調整大小，最大高度和寬度爲95％，滾動條自動溢出。我是一個CSS初學者，如果我正在做一些完全錯誤/愚蠢的事情，請耐心等待。bootstrap模態窗口動態寬度與最大值？

高度工作得很好，它動態調整大小，如果它達到最大值，它會溢出w /滾動條。我只是無法工作的寬度。我可以讓它填充整個頁面，或保持較小，但不能動態調整大小。我知道將樣式放入內聯是一種糟糕的做法，但我只是爲了這個頁面而做的。

我的引導模式：

<div class=modal fade" id="myModal" tabindex=-1 role="dialog"> 
     <div class="modal-dialog" role="document"> 
      <div class="modal-content"> 
       <div class="modal-body" style="overflow-x:auto;overflow-y:auto;max-height:1000px;max-width:95%;"> 
        ... close all the above tags w/o anything but standard div/span for modal message and footer

我認爲這個問題是引導情態動詞有一個默認的寬度值，我不認爲我可以覆蓋（根據大小，像默認情況下，模態-SM，或莫代爾-LG）。任何線索我怎麼能做到這一點？

來源

2017-03-09 user797963

您可以根據在下面的方式 -

工作示例

.modal-dialog{ 
 
    position: relative; 
 
    display: table; 
 
    overflow-y: auto;  
 
    overflow-x: auto; 
 
    width: auto; 
 
    min-width: 300px; 
 
}

<!DOCTYPE html> 
 
<html> 
 

 

 
<head> 
 
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
      <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 

 
      </head> 
 
<body > 
 
<button type="button" data-toggle="modal" data-target="#myModal">Open Modal</button> 
 
<div class="modal fade" id="myModal" tabindex=-1 role="dialog"> 
 
     <div class="modal-dialog" role="document"> 
 
      <div class="modal-content"> 
 
       <div class="modal-body"> 
 
        <p>close all the above tags w/o anything but standard div/span for modal message and footer............................................................................................................................................................................................</p> 
 
        </div> 
 
        </div> 
 
        </div> 
 
        </div> 
 
</body> 
 

 
</html>

來源

2017-03-10 05:19:16 neophyte

嗯內容優化模態的高度和寬度，這並動態大小的模式窗口，但溢出似乎沒有工作。模態將擴展超出頁面的高度和寬度。我已經嘗試添加最大高度和最大寬度，但是模式內的內容大小不正確。 – user797963

我可以通過在.modal上設置寬度來使其「足夠接近」 – user797963

bootstrap模態窗口動態寬度與最大值？

回答

相關問題