Forms Sky Form/Bootstrap 3:如何渲染多个输入,使其看起来像一个大输入?
我正在使用sky表单库和bootstrap 3来渲染我的表单 我有3个输入,我想包装在一起 我知道这需要自定义css规则,但我无法使其按预期工作 请参阅所附图片,以更好地了解我的需要 10倍Forms Sky Form/Bootstrap 3:如何渲染多个输入,使其看起来像一个大输入?,forms,css,twitter-bootstrap,Forms,Css,Twitter Bootstrap,我正在使用sky表单库和bootstrap 3来渲染我的表单 我有3个输入,我想包装在一起 我知道这需要自定义css规则,但我无法使其按预期工作 请参阅所附图片,以更好地了解我的需要 10倍 这是一个开始。您可能需要稍微调整一下焦点突出显示 请把你试过的贴出来。 <style> .joined-left { margin-right: -10px; } .joined-right { margin-left: -10px; border-left: 0;
这是一个开始。您可能需要稍微调整一下焦点突出显示
请把你试过的贴出来。
<style>
.joined-left {
margin-right: -10px;
}
.joined-right {
margin-left: -10px;
border-left: 0;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
</style>
<div class="form-group">
<label class="sr-only" for="exampleInputEmail2">Email address</label>
<input type="email" class="form-control joined-left" id="exampleInputEmail2" placeholder="Enter email" />
</div>
<div class="form-group">
<label class="sr-only" for="exampleInputPassword2">Password</label>
<input type="password" class="form-control joined-right" id="exampleInputPassword2" placeholder="Password" />
</div>