Bootstrap Text一个在导航中的另一个

时间:2017-10-11 13:09:22

标签: html css twitter-bootstrap-3

我正在尝试在bootstrap中创建一个配置文件按钮。

它应该在顶部显示Name,在下面显示用户类型,右边显示Caret基本上是标准引导文本,带有插入符号下拉列表,但带有第二行文本。 从jsfiddle可以看出,插入符号最终出现在两个文本之下。

我需要更改什么才能使插入符号保持在两者的右侧?

<li class="dropdown">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
      <div>Joe Shmo 

      <div style="font-size: 10px;">
        SUPERUSER
        </div>
      </div>
      <span class="caret"></span></a>
      <ul class="dropdown-menu">
                <li><a href="/profile"><i class="fa fa-fw fa-user"></i> Edit Profile</a></li>
                <li><a href="/password-change"><i class="fa fa-fw fa-cog"></i> Change Password</a></li>
                <li class="divider"></li>
                <li><a href="/logout/"><i class="fa fa-fw fa-power-off"></i> Logout</a></li>
            </ul>
    </li>

https://jsfiddle.net/5v35ezfc/1/

1 个答案:

答案 0 :(得分:0)

替换为以下

<div>
  Joe Mallanga <span class="caret"></span>
  <div style="font-size: 10px;">
    SUPERUSER
  </div>
</div>