字段集填充不适用于内部 div
所以我有 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 边距。右边距不起作用,我尝试让字段集具有不同的显示属性,但似乎没有任何效果。有什么想法吗?
So I have the html code:
<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>
And my css is:
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;
}
I am trying to get it so there is 10px margin on the right side of the divs inside the feildset. The margin-right doesn't work, and I have tried to have the fieldset with different display attibutes but nothing seems to work. Any ideas?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
如果您从 div 中删除
width:100%
,它就会起作用。否则,您可以在fieldset
上添加更多填充,或为input
添加margin-right
。if you remove the
width:100%
from the divs it works. Otherwise you can add more padding on thefieldset
or addmargin-right
for theinput
.