css - 并排渲染项目

Question

我正在尝试显示一个页面，该页面包含一个带有 3 个列表项的标题、一个带有左侧链接的侧边栏和实际正文。我希望侧边栏和正文在标题下并排呈现。但是，它们在页面上一个接一个地呈现。关于如何做到这一点的任何建议？

我已经使用以下代码和样式来实现这一点，但它似乎不起作用。

<div>  
    <h1 class="control-label admin-header" style="vertical-align:top;padding-left:20px">Administration</h1>
    <ul class="nav nav-pills admin-header" style="float:right">
        <li class="active admin-header"><a href="http://localhost:10004/test">test</a></li>
        <li class="admin-header"><a href="http://localhost:10004/xyz">xyz</a></li>
        <li class="admin-header"><a href="https://localhost:10004/abc">abc</a></li>
    </ul>
    </div>
    <div>
    <div class="span3 admin-header">
        <div class="well sidebar-nav admin-header">@RenderSection("Sidebar", false)</div>
    </div>
    <div class="content span12 admin-header">@RenderBody()
    </div>
    </div>

.admin-header
{
    display: inline;
}​

小提琴

Answer 1

不确定我是否理解，但对于并排显示，您可以使用

<table>
<tr>
<td class="active admin-header"><a href="http://localhost:10004/test">test</a></td>
<td class="admin-header"><a href="http://localhost:10004/xyz">xyz</a></td>
<td class="admin-header"><a href="http://localhost:10004/xyz">abc</a></td>
</tr>
</table>