Question

我有2个字段集：

<fieldset> first fildset </fieldset>

<fieldset> second fieldset </fieldset>

如何将它们放在同一行？

Answer 1

您可以将display css属性设置为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

Answer 2

您也可以使用display:inline;

Answer 3

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

一个。将display: inline-block放在字段集的样式表中。

湾将一个fieldsets浮动到另一个的左侧或右侧。 float: left

℃。使它们绝对或相对定位即。 position: absolute并设置适当的左上角和左侧

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

Answer 4

将它们放在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>

Answer 5

将它们放在table .as

中

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

FIDDLE就在这里

fieldset同一行

5 个答案: