用css和引导4对齐输入
用css和引导4对齐输入
提问于 2018-05-20 22:52:38
我有一张表格，我想在页面上居中。标签是居中的，但由于某种原因，我无法用窗体控件类对输入进行集中。
就像现在这样..。
编辑:表单控件中的display: block;导致了问题。不知道为什么，我怎么才能禁用它？
#centered {
text-align: center;
}<div id='centered'>
<span class="form-group">
<h5 class="label">Email</h5>
<input class="form-control" id="ex2" type="text">
</span>
<span class="form-group">
<h5 class="label">Name</h5>
<input class="form-control" id="ex2" type="text">
</span>
<span class="form-group">
<h5 class="label">Create A Password</h5>
<input class="form-control" id="ex2" type="text">
</span>
<span class="form-group">
<h5 class="label">Confirm Password</h5>
<input class="form-control" id="ex2" type="text">
</span>
<input class="form-group-check-input" type="checkbox" value="" id="confirm_terms"> <strong>Agree to terms</strong>
</div>
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-05-20 23:33:20
您可以尝试更改该div中所有form-control的display属性：
#centered .form-control {
display: inline;
} Stack Overflow用户
发布于 2018-05-21 07:56:34
使用类mx-auto
/* CSS used here will be applied after bootstrap.css */
#centered {
text-align: center;
width:100px;
}<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<div id='centered' class="mx-auto">
<span class="form-group">
<h5 class="label">Email</h5>
<input class="form-control" id="ex2" type="text">
</span>
<span class="form-group">
<h5 class="label">Name</h5>
<input class="form-control" id="ex2" type="text">
</span>
<span class="form-group">
<h5 class="label">Create A Password</h5>
<input class="form-control" id="ex2" type="text">
</span>
<span class="form-group">
<h5 class="label">Confirm Password</h5>
<input class="form-control" id="ex2" type="text">
</span>
<input class="form-group-check-input" type="checkbox" value="" id="confirm_terms"> <strong>Agree to terms</strong>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50440100
复制相关文章
相似问题
腾讯云开发者
