2

我正在创建一个表单并使用浮动水平显示一组单选按钮以节省空间。但是,之后我无法清除浮动,收音机下方的标题就在它们旁边。

html代码如下:

<div class="choice">

<ul>

<li><label for="yes">Yes</label><input type="radio" name="newsletter" id="yes" value="yes"/></li>
<li><label for="no">No</label><input type="radio" name="newsletter" id="no" value="no"/></li>

</ul>

</div>

<h2>Questions or Comments</h2>

我的CSS如下:

.choice ul li label {width: 30px;}

.choice ul li {float:left;}

.choice {clear:both;}

输出看起来像这样(这里的星号代表单选按钮):

Would you like to subscribe to our newsletter?

Yes * No * Questions or Comments
4

4 回答 4

1

我尝试使用 clear left 的样本作为选择 div。改变了.choice风格,如下所示,

CSS:

.choice:after {content:"#"; visibility:hidden; clear:both;}

检查样本对您有用吗。

于 2012-10-12T06:08:58.580 回答
1
h2 {clear:both;}

尝试了上述方法,它似乎工作。

于 2012-10-12T18:30:13.170 回答
0

您使用此样式代码

.choice ul li {clear:both}
于 2012-10-13T06:52:07.267 回答
0

这是清晰的代码。

HTML:

<div class="choice">

<ul>

<li><label for="yes">Yes</label><input type="radio" name="newsletter" id="yes" value="yes"/></li>
<li><label for="no">No</label><input type="radio" name="newsletter" id="no" value="no"/></li>

</ul>
    <div class="clear"></div>
</div>

<h2>Questions or Comments</h2>

CSS:

.choice ul li label {width: 30px;}

.choice ul li {float:left;}

.clear {clear:both;}

欢呼..............

于 2012-11-02T14:55:49.780 回答