Html 链接按钮和引导图标样式问题

我的问题是，当我在下拉菜单中使用LinkButton时，图标和LinkButton文本显示为两行

HTML

<ul class="nav navbar-nav navbar-right">
  <li>
    <a data-toggle="dropdown" class="dropdown-toggle text-white" href="#">Hi,
      <asp:Label ID="lbllname" runat="server" Text=""></asp:Label>
      <b class="caret"></b>
    </a>
    <ul style="margin: 25px 15px 0 0;" role="menu" class="dropdown-setting dropdown-menu bg-amber">
      <li>
        <a href="#">
          <span class="entypo-user"></span>&nbsp;&nbsp;My Profile</a>
      </li>
      <li>
        <a href="#">
          <span class="entypo-vcard"></span>&nbsp;&nbsp;Account Setting</a>
      </li>
      <li>
        <a href="#">
          <span class="entypo-lifebuoy"></span>&nbsp;&nbsp;Help</a>
      </li>
      <li>
        <a href="#">
          <span class="icon-upload"></span>&nbsp;&nbsp;
          <asp:LinkButton ID="btnlogout" OnClick="btnlogout_Click" runat="server">Log out</asp:LinkButton></a>
      </li>
    </ul>
  </li>
</ul>

浏览器中呈现的链接按钮，如下图所示

<li>
<a href="#">
<span class="icon-upload"></span>&nbsp;&nbsp;
</a><a id="btnlogout" href="javascript:__doPostBack('ctl00$btnlogout','')">Log out</a>
</li>

只需将此作为CSS修复：

.navbar-right li {white-space: nowrap;}

这是由于您不正确地使用了

，可以通过强制浏览器使用

nowrap

在一行中呈现文本来修复

另一个问题是您有一个嵌套的

标记。这不应该发生。请按以下方式更改标记：

<asp:LinkButton ID="btnlogout" OnClick="btnlogout_Click" runat="server">
    <span class="icon-upload"></span> Log out
</asp:LinkButton>

注销

运气不好，我甚至什么都没删除changes@Ayman对不起，我只是稍微更改了CSS。从中卸下

a

。现在检查？Np，我还有issue@Ayman检查LI，截图检查全屏，所有样式都在右侧，带有HTML。同时更新呈现的HTML。明白了。你不应该有一个包装

。