1

我试图在输入单选按钮之后放置文本,但文本始终位于单选按钮下方。我使用了显示的 CSS,但我得到了相同的结果。

CSS:

<style>  

.sp-list .sp-item {
  list-style:none;
  margin:0;
  padding:0;
}

.sp-item {
  clear:both;
  display:block;
  margin:1em 0;
}

.sp-input-radio {
  float:left;
  margin:0.5em 1em 0 0;
}

.sp-label {
  display:inline-block;
  width:200px;
  white-space:nowrap;
}

</style>

HTML:

<fieldset>
<ul class="sp-list">
<li class="sp-item">
<input name="answer" value="1" id="poll-1-1" class="sp-input-radio" type="radio">
<label for="poll-1-1" class="sp-label"> Ok very nice </label>
</li>
</fieldset>

我试过了,但无法在同一行的输入单选之后显示文本。

4

2 回答 2

1

尝试删除float:left;输入,它会像你想要的那样排列 - jsFiddle here

只是改变:

.sp-input-radio {
  float:left;
  margin:0.5em 1em 0 0;
}

到:

.sp-input-radio {
  margin:0.5em 1em 0 0;
}

如有必要,您也可以在该类中取出边距(除非您最初希望它是这样间隔的)。

于 2013-04-06T17:19:58.377 回答
0

我为您的解决方案创建了一个小提琴,发现您的单选按钮具有以下 css 属性

margin:0.5em 1em 0 0;

哪个螨虫引起了问题,我删除了:

演示: http: //jsfiddle.net/u7n4h/希望对您有所帮助

于 2013-04-06T17:20:19.183 回答