html - 如何在 li 标记内联两个 a 标记，该标记位于导航对齐的导航选项卡内

Question

我有一些 nav-tabs，我正在尝试在 li 标签之一中插入两个 a 标签，该标签是选项卡。我遇到的问题是 a 标记出现在不同的行上。我试图内联 a 标签，但这似乎不起作用。我应该怎么做才能让 a 标签在同一行？

这是一个 jsfiddle:https://jsfiddle.net/aaronmk2/DTcHh/51099/

这是我的 Html 代码:

<div class="container">
    <div class="navbar navbar-default">
        <div class="navbar-collapse collapse">
            <ul class="nav nav-tabs nav-justified" role="tablist">
                <li role="presentation" class="active test">
                    <a href="#" role="tab" data-toggle="tab" class="test1">View</a>
                     <a href="" class="test1"><i class="fa fa-question-circle" aria-hidden="true"></i></a>
                </li>
            </ul>
        </div>
    </div>
</div>

这是我的CSS

@import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');

body {
    margin: 10px;
}
.test{
  display: inline;
}
.test1{
  display: inline;
}

Answer 1

您可能应该将 2 个 a 标签包装在一个 span 标签中，并为其添加一个内联。

span{
  display: inline;
}

参见 fiddle :https://jsfiddle.net/DTcHh/51103/