借助以下指南,我在CSS的帮助下实现了一种很好的两列布局形式。

http://articles.sitepoint.com/article/fancy-form-design-css

我的标记大致像

<form>
  <fieldset>
    <legend>
      <ol>
        <li>
           <label>
           </label>
           <field>
           <field>
        </li>
        <!-- more fileds -->
      </ol>
  </fieldset>

  <fieldset>
     <!-- similar -->
  </fieldset>

</form>


这将创建一个不错的两列布局。我想要实现的是将字段集一个接一个地垂直放置,并排放置的感觉。这应该给我四列的布局。

我该如何实现?

最佳答案

在您的CSS中:

fieldset { display: inline; }


默认情况下,<fieldset>元素是block类型。将其更改为inline将使他们彼此相邻。

您也可以使用float: left;达到此效果,但这可能会导致其他布局问题。

10-05 20:45
查看更多