Question

我想将标签和值水平显示在一起，例如：

Team: Lorem Ipsum and then some

目前他们是彼此之上的。

在下面找到我最不可行的例子：

＆＃13;

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<div class="form-horizontal">
  <div class="control-group">
    <div class="controls">
      <label class="control-label">Team:</label>
      <p class="form-control-static">Lorem Ipsum and then some</p>
    </div>
  </div>
</div>

＆＃13;

有什么建议我做错了吗？

Answer 1

因为你正在添加＆lt; p>自动换行的标记，因为它是段落标记...请改用span类...

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<div class="form-horizontal">
    <div class="control-group">
        <div class="controls">
            <label class="control-label">Team:</label>
            <span class="form-control-static">Lorem Ipsum and then some</span>
        </div>
    </div>
</div>

或者如果你真的想要使用＆lt; p>我可以建议一些样式标签，最好带有id：

p {
    display:inline-block;
}

标签/值彼此靠近

1 个答案: