html - 表单元素没有移动到中心

Question

我是网络编程的新手。

我的 head 标签中有一个样式标签，如下所示:

<style type="text/css">
  .center {
      float: none;
      margin-left: auto;
      margin-right: auto;
  }

我使用 Twitter Bootstrap 。我将 form 包裹在 div block 中

<div class="center"
    <form>
      <fieldset>
        <legend>Legend</legend>
        <label>Label name</label>
        <input type="text" placeholder="Type something…">
        <span class="help-block">Example block-level help text here.</span>
        <label class="checkbox">
          <input type="checkbox"> Check me out
        </label>
        <button type="submit" class="btn">Submit</button>
      </fieldset>
    </form>
</div>

但是 form 元素甚至没有移动到中心。

我在哪里犯了错误？

Answer 1

这是居中的，但由于 div 是 block 元素，除非您提供一些宽度( Example 指定宽度)，否则您无法找出差异

那么试试这个

 .center {
      float: none;
      margin-left: auto;
      margin-right: auto;
    text-align:center
  }
legend{
    text-align:left
}

DEMO