6

我有 2 个字段集：

<fieldset> first fildset </fieldset>

<fieldset> second fieldset </fieldset>

如何将它们放在同一行？

4

5 回答 5

10

您可以将他们的displaycss 属性设置为inline：

<style type="text/css">
  fieldset.inline {
    display: inline;
  }
</style>

<fieldset class="inline"> first fildset </fieldset>
<fieldset class="inline"> second fieldset </fieldset>

结果如下：http: //jsbin.com/aseyej/1/edit

于 2013-02-22T15:30:29.013 回答
2

将它们放在一个 div 容器中。

<style type="text/css">
    .container {
    height:100px;
    width:600px;
    background-color:gray;       
}
.left {
    float:left;
    width:200px;
    background-color:blue;
}
.right {
    float:right;
    width:400px;
    background-color:red;
}
</style>

<div class="container">
    <div class="right"><fieldset> first fildset </fieldset></div>
    <div class="left"><fieldset> second fieldset </fieldset></div>
</div>
于 2013-02-22T15:28:06.753 回答
1

你也可以使用display:inline;

于 2013-02-22T15:30:17.220 回答
1

feldset 是一个块级元素，因此通常出现在页面布局中的两个块中，因此要将它们放在一行中，有很多可能性，例如您可以：

一种。放入display: inline-block字段集的样式表。

湾。将其中一个字段集浮动到另一个字段集的左侧或右侧，即。float: left

C。使它们成为绝对或相对定位，即。position: absolute并设置适当的顶部和左侧

还有其他方法，但这三种在大多数情况下都适用。

于 2013-02-22T15:36:28.137 回答
0

将它们放在table.as中

<table>
   <tr>
     <td>
       <fieldset>
          first fildset
       </fieldset>
     </td>
     <td>
       <fieldset>
          second fieldset 
       </fieldset>
    </td>
</table>

小提琴在这里

于 2013-02-22T15:29:11.633 回答