本文介绍了为什么放置在Bootstrap Jumbotron内部时这个窗体会断裂?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个表单,当它放置在Bootstrap Jumbotron内部时会断开。
I have a form and it breaks when placed inside a Bootstrap Jumbotron.
需要做什么才能使这项工作正常?
What needs to be done for this to work ok?
代码 / p>
Code
<div class="container">
<div class="col-sm-6 col-sm-offset-3 well well-sm">
<h3><i class="fa fa-rocket"></i> Quick Connect</h3>
<form class="form" role="form" action="chat" method="post">
<fieldset>
<div class="input-group">
<input name="nickname" type="text" placeholder="Enter a nickname, be creative!" class="form-control">
<span class="input-group-btn">
<button class="btn btn-default" type="submit">Enter Chat</button>
</span>
</div>
</fieldset>
</form>
</div>
</div>
Jumbotron外部
内部Jumbotron
感谢
Steve
/ strong>有人可以提供一个例子来解决这个问题吗?
Can someone also provide an example of how to fix this?
推荐答案
这是因为jumbotron覆盖btn-它。您可以尝试将其更改为btn-small,看看是否给出了所需的结果。如果不是,你只需定义一个新的css类并复制正常的样式。
This is because jumbotron overrides btn-default to scale it up. You can try changing it to btn-small and see if that gives the desired result. If not you can just define a new css class and copy the normal style.
这篇关于为什么放置在Bootstrap Jumbotron内部时这个窗体会断裂?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!