文本旁边的输入单选按钮

我试图在输入单选按钮后放置文本，但文本总是在单选按钮下。我使用了显示的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>

我试过，但不能让文字在同一行中输入无线后显示。

来源

2013-04-06 user2202136

是否有足够的空间将它们保存在一行中？ – Musa 2013-04-06 17:20:30

尝试删除输入上的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-06 17:19:58 lifetimes

Thank's !!!!!!!!!!! – user2202136 2013-04-06 20:39:39

我创建了一个小提琴为您的解决方案，并发现了你的单选按钮有以下CSS属性

margin:0.5em 1em 0 0;

其中螨会造成问题，我删除了：

演示：http://jsfiddle.net/u7n4h/希望它有帮助

来源

2013-04-06 17:20:19

文本旁边的输入单选按钮

回答

相关问题