twitter-bootstrap Bootstrap 模式不会拉伸以适应内容
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/23982234/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap modal won't stretch to fit content
提问by LukeZaz
The modal, despite the same thing working fine on other pages, won't stretch to fit it's content and ends up too short. The only thing that seems to fix it is adding another divor pelement with any content below it and I'd rather not have to do that.
模态，尽管在其他页面上也能正常工作，但不会拉伸以适应它的内容并且最终太短。唯一似乎可以修复它的是添加另一个div或p元素下面的任何内容，我宁愿不必这样做。
HTML:
HTML：
<!-- Donate modal -->
<div class="modal fade" id="donate" tabindex="-3" role="dialog" aria-labelledby="donateToDev" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="donateTitle">Donate</h5>
</div>
<div class="modal-body">
<p class="text-center">There's nothing to unlock by donating, but you will be considered awesome by the dev! Who doesn't like being awesome?</p>
<div class="text-center">
<div style="float:left;display:inline;">
PAYPAL
</div>
<div style="float:right;display:inline;">
<p class="bold text-center">Or you could donate with <a href="http://dogecoin.com">Dogecoin</a>:
<p class="code">doge donate address here</p>
</div>
</div>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
CSS:
CSS：
.bold { font-weight: bold; }
.text-center { text-align: center; }
Result:
结果：
采纳答案by david
You are not clearing your floats. To quickly solve the issue you could add "clearfix" to the div with the "text-center" class.
你没有清理你的浮动。要快速解决该问题，您可以使用“text-center”类向 div 添加“clearfix”。
Read about it here: http://getbootstrap.com/css/#helper-classes-clearfix
回答by Costas Bakoulias
Try this :
试试这个 ：
<div class="modal-body" style="overflow-y:auto;">
回答by Rohit Vinay
You probably have another stylesheet hindering with the bootstrap.css file. try playing with the inspect element of the browser
您可能有另一个样式表阻碍了 bootstrap.css 文件。尝试使用浏览器的检查元素
or
或者
try this
试试这个
.modal-dialog{overflow:visible;min-height:100%!important;}
you can try using "!important", to override whatever is making it happen so.
你可以尝试使用“!important”来覆盖任何使它发生的事情。
回答by Dedek
Try to add a style of
尝试添加样式
.modal-body{ height:100% }
.modal-body{ 高度：100% }
it works for me :)
这个对我有用 ：）
