0

我遇到了一个 CSS 问题。我有一个表格，在里面我想在每一行显示一个标签和一些信息。表单的 html 是：

<form class="form_dialog">
</br>
<label>Status: </label>
<span><img src="images/check.png" alt="check mark" width="16" height="16"/></span>
</br></br>
<label>Type: </label>
<span>V1</span>
</br></br>
<label>Description: </label>
<div class="sp">16 Nodes - Test for long description.
This system is good in all cases. Max length is 100.</div>
</form>

所有标签的css是：

form.form_dialog {float: left; clear: left;}

.form_dialog div {float:left; clear:left}
.form_dialog label {
    display: block; float: left; 
    width: 12.0em; min-height: 2.0em; text-align: right;
}

.form_dialog span {
    margin-left: 3.0em;
}

div.sp {
     display:inline;
     margin-left:3em;
     margin-right:3em;
     width:70%;
}

我的问题是，对于描述信息，我想保持文本行缩进（每行从同一位置开始）以及与标签内联。但达不到。有人可以帮忙吗？谢谢。

4

2 回答 2

2

您正在创建一个表。您可以使用表格，或使用两个单独的元素，并排放置在包含的内部。

<div class="container">
   <div class="formContainer">
   </div>
   <div class="textContainer">
   </div>
</div>

然后浮动每个容器并使用 CSS 对齐文本。

于 2013-07-27T00:24:37.667 回答
1

也同意 Trendy，因为你开始使用span标签，你应该只使用span

<span>16 Nodes - Test for long description.
This system is good in all cases. Max length is 100.</span>
于 2013-07-27T00:30:15.907 回答