并排渲染项目

时间:2012-07-19 15:24:43

标签: css asp.net-mvc razor

我正在尝试显示一个页面,其中包含一个包含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;
}​

Fiddle

1 个答案:

答案 0 :(得分:0)

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

<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>