html - 在一行中显示两个单选按钮

标签 html css radio-button

 <ul>
    <li  style="list-style:none;">
     <input type="radio" name="custom_type" value="public" />
      Public
     <input type="radio" name="custom_type" 
     value="private" id="custom_venuetype_private" />Private
     </li>
 </ul>

我有 2 个单选按钮。我的问题是两个单选按钮都排成两行,并且在单选按钮之后自动出现一些空白,即在第一个单选按钮之后,出现一些空白,然后是文本。并且下一个单选按钮出现在新行中。我需要在单行中同时使用,并且文本和单选按钮之间不需要空格

最佳答案

为了将元素放在一行中,您可以使用具有 inline 值的 CSS display 属性:

HTML:

<ul>
  <li  style="list-style:none;">
    <input type="radio" name="custom_type" value="public" />
    Public
    <input type="radio" name="custom_type" 
    value="private" id="custom_venuetype_private" />
    Private
  </li>
</ul>

CSS:

.li {display:inline}

这里是 JSFiddle .

关于html - 在一行中显示两个单选按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14645709/

相关文章:

javascript - 图像而不是单选按钮/文本?

Outlook 中的 HTML 电子邮件

javascript - 如何将 "shrink wrap"周围的 div float 为子级

javascript - 如何将一些js应用到gxt元素?

java - 我的单选按钮代码出了什么问题?

jquery - 如何使用 jQuery 向我的导航栏添加悬停下拉功能

Jquery 选择 href 到 JPG

html - 需要 ul 的中心对齐,其 <li> 向左浮动

jQuery 脉动 div

html - 仅出现在导航中的四张图片中