Html CSS 样式=显示：块不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11977425/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS style=display:block not working
提问by rajeev
Browser is Firefox.
浏览器是火狐。
I have a list of 15 radio buttons. After displaying them like this:
我有一个包含 15 个单选按钮的列表。像这样显示它们之后：
<div class="abcd" style="margin-left:10px;">
<form id='some'....>
<legend>Select Item type :</legend>
<fieldset style="display:block;float:left;">
<input class="yy" id="sss" type="radio" name="group0" value="aaa"/> ABC
...
</fieldset>
<p>
<input placeholder="Enter Name/Value" name="xxx" id="xxx" size="40" style="display:block;float:left;">
<button type="button" id="xxx" style="width:100;">Process</button>
</p>
</form>
</div>
Everything is displaying in one line. I am not sure how to display the textbox under radio buttons with some space in between.?
一切都显示在一行中。我不确定如何在单选按钮下显示文本框，中间有一些空间。？
pl help.
请帮忙。
回答by Mauricio Souza Lima
The problem with your style is the float: left, you have to clear the "floatness".
At the ptag, include the clear:both, it tells the browser that nothing can float at its left or right.
你的风格有问题float: left，你必须清除“浮动”。在p标签处，包含clear:both，它告诉浏览器在它的左边或右边没有任何东西可以浮动。
<div class="abcd" style="margin-left:10px;">
<form id='some'>
<fieldset style="display:block;float:left;">
<input class="yy" id="sss" type="radio" name="group0" value="aaa"/> ABC
<input class="yy" id="sss" type="radio" name="group0" value="aaa"/> ABC
<input class="yy" id="sss" type="radio" name="group0" value="aaa"/> ABC
</fieldset>
<p style="clear:both">
<input placeholder="Enter Name/Value" name="xxx" id="xxx" size="40" style="display:block;float:left;">
<button type="button" id="xxx" style="width:100;">Process</button>
</p>
</form>
</div>
回答by JohnFromMiami
When using the floatattribute you have to clear it so that other elements won't appear floating next to it. try adding clear: bothto the css of the input box like this:
使用该float属性时，您必须清除它，以便其他元素不会出现在它旁边。尝试clear: both像这样添加到输入框的 css 中：
<input placeholder="Enter Name/Value" name="Name" id="NameID" size="40"
style="clear:both; display:block;"/>
回答by user1601479
paste
粘贴
<div style="clear:both"></div>
after the fieldset.
在字段集之后。
回答by Phillip Schmidt
Try adding the css rule to the radio buttons themselves. Like this:
尝试将 css 规则添加到单选按钮本身。像这样：
<style type="text/css">
.group0
{
display:block;
}
</style>
This assumes group0is the group with all the radio buttons.
这假设group0是具有所有单选按钮的组。
