0

我有一个带有单选按钮作为菜单元素的菜单的导航栏，但它们不太好：

<!DOCTYPE HTML>
<div class="navbar">
  <div class="navbar-inner">

  <ul class="nav pull-right">

  <li>
 <form method="get" action="search" class="navbar-form pull-right">
  <input type="text" name="q" class="input-medium search-query" placeholder="Search">
    </li>      
     <li id="nav_search_filter" class="dropdown">
            <a class="dropdown-toggle" data-toggle="dropdown" href="#"><b class="caret"></b></a>
            <ul class="dropdown-menu">
              <li>Search:</li>
              <li>
                <input type="radio" id="search_filter_all" name ="search_filter" value="all" checked="checked"/> 
                <label for="search_filter_all">All</label>
              </li>
              <li><input type="radio" id="search_filter_inactive" name ="search_filter" value="inactive" /> <label for="search_filter_inactive">Inactive</label></li>

              <li><input type="radio" id="search_filter_active" name ="search_filter" value="active" /> <label for="search_filter_active">Active</label></li>

            </ul>
          </li>
</form>          


</ul>
</div>
</div>

http://jsfiddle.net/2SmWq/

4

2 回答 2

2

你可以尝试这样的事情：

label {margin:10px;}
input[type="radio"] {display:inline-block; vertical-align:top;}

并将标签包装在 html 中的输入标签周围。

这是一个jsfiddle来了解我的意思。

希望这可以帮助。

于 2013-05-11T15:29:58.647 回答
0

如果你想要它在同一行中有单选按钮和标签。尝试这个：

<style>

    label {
        display:inline-block;

    }
</style>
于 2013-05-11T14:28:29.887 回答