我使用用户控件在 ASP.NET MVC 应用程序中显示一堆字段。 例如。
<div class="metadata-left metadata">
<div>
Default Domain:</div>
<br />
<div>
Disabled:</div>
<br/>
</div>
<div class="metadata-right metadata">
<div>
<%= Html.EditorFor(c => c.IsDefault) %></div>
<br />
<div>
<%= Html.EditorFor(c => c.IsDisabled) %></div>
<br />
</div>
在样式表中,我有以下类:
.metadata-left
{
float: left;
width: auto;
text-align: right;
}
.metadata-right
{
float: left;
width: 68%;
padding-left: 3%;
text-align: left;
}
.metadata div
{
height: 20px;
}
如何让这些字段并排显示?现在,我将它们一个接一个地放在一列中。
最佳答案
像这样组织元素可能会更成功
<div class="metadata-field">
<div class="metadata-left metadata">
Default Domain:
</div>
<div class="metadata-right metadata">
<%= Html.EditorFor(c => c.IsDefault) %>
</div>
</div>
<div class="metadata-field">
<div class="metadata-left metadata">
Disabled:
</div>
<div class="metadata-right metadata">
<%= Html.EditorFor(c => c.IsDisabled) %>
</div>
</div>
使用 CSS:
.metadata-field {
clear:both;
}
.metadata-left
{
float: left;
width: auto;
text-align: right;
}
.metadata-right
{
float: left;
width: 68%;
padding-left: 3%;
text-align: left;
}
.metadata div
{
height: 20px;
}
您可以进行调整以进一步更改布局。
关于asp.net - 样式表 - 如何让字段并排显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10109844/