我刚开始使用 Bootstrap。我尝试调整 3 列的行以适应,最后一列分为另外 3 列,但它重叠并且很难使其看起来正确。
第一行的我的 cshtml:
<div class="row">
<div class="col-md-4 col-sm-4">
<strong>Last Name</strong> <span class="required">*</span>
@Html.TextBoxFor(m => m.Patient_Lastname, new { @class = "text-primary", required = "required" })
</div>
<div class="col-md-4 col-sm-4">
<strong>First Name</strong> <span class="required">*</span>
@Html.TextBoxFor(m => m.Patient_Firstname, new { @class = "text-primary", required = "required" })
</div>
<div class="col-md-1 col-sm-1">
<strong>birth</strong> <span class="required">*</span>
@Html.DropDownListFor(m => m.YearOfBirth, Enumerable.Range(1900, 119).Select(i => new SelectListItem { Value = i.ToString(), Text = i.ToString() }),
"--Year--", new { @class = "form-control", style = "width: 90px; height:30px;", required = "required" })
</div>
<div class="col-md-1 col-sm-1">
<strong>Month</strong> <span class="required">*</span>
@Html.DropDownListFor(m => m.YearOfBirth, Enumerable.Range(1, 12).Select(i => new SelectListItem { Value = i.ToString(), Text = i.ToString() }),
"--Month--", new { @class = "form-control", style = "width: 90px; height:30px;", required = "required" })
</div>
<div class="col-md-2 col-sm-2">
<strong>Day</strong> <span class="required">*</span>
@Html.DropDownListFor(m => m.YearOfBirth, Enumerable.Range(1, 31).Select(i => new SelectListItem { Value = i.ToString(), Text = i.ToString() }),
"--Day--", new { @class = "form-control", style = "width: 80px; height:30px;", required = "required" })
</div>
</div>
第二行和第三行直接用 col-md-4
你能帮我解决这个问题吗?
TIA 罗恩。
最佳答案
我认为问题在于输入的填充宽度大于可用宽度,请尝试调整它的大小。
关于css - Bootstrap 列宽调整,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56385829/