navbar bootstrap上的标题标题

Question

我想根据Visual Studio 2010的模板制作一个包含bootstrap和similitar主题的页面。

我希望标题和导航栏始终位于顶部。

我的代码是：

    <div class="navbar navbar-default navbar-fixed-top">
    <div class="container" id="banner">
        <div class="container">
            <h1 id="Title">Control de Operaciones y Gestión de Campaña</h1>
        </div>
    </div>
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            @*@Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })*@
        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li>@Html.ActionLink("Home", "Index", "Home")</li>
                <li>@Html.ActionLink("About", "About", "Home")</li>
                <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
            </ul>
        </div>
    </div>
</div>

css

#banner {
 background-color: #4b6c9e;   
 width: 100%;
 text-align:left;
 background-size: cover;
 }

#Title {
    color: #ffffff;
    font-variant: small-caps;
    text-transform: none;
    font-weight: bold;
    margin-bottom: 0px;
    font-size: 1.6em;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

但是当我渲染内容页面时，第一行就在导航栏后面

如何制作标题和导航栏？