html - 字段集填充不适用于内部 div

Question

所以我有html代码:

<fieldset>
     <legend>Log On</legend>

     <div class="altregrow">
          <label for="UserName">User name</label>
          <input type="text" value="" name="UserName" id="UserName">
     </div>

     <div class="regrow">
          <label for="Password">Password</label>
          <input type="password" name="Password" id="Password">
     </div>

     <div class="altregrow">
          <label for="RememberMe">Remember me?</label>
          <input type="checkbox" value="true" name="RememberMe" id="RememberMe">
     </div>

     <p class="right">
          <input type="submit" value="Log On">
     </p>
</fieldset>

我的 CSS 是:

fieldset {
margin: 0 10px 10px 10px;
padding: 10px;
width: auto;
border: 1px solid #333;
display: block;
}
fieldset p { margin: 0.5em 0 0 0; }
.regrow, .altregrow {
text-align: left;
padding: 7px 5px;
width: 100%;
margin-right: 10px;
overflow: auto;
}
.regrow input, .altregrow input {
float: right;
margin-right: 5px;
margin-top: 2px;
}
.altregrow {
background: url(bg2.png) repeat;
border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
}

我正在尝试获取它，以便在 feildset 内的 div 右侧有 10px 的边距。 margin-right 不起作用，我试图让字段集具有不同的显示属性，但似乎没有任何效果。有什么想法吗？

Answer 1

如果您从 div 中删除 width:100% 它会起作用。否则，您可以在 fieldset 上添加更多填充或为 input 添加 margin-right。