Question

我正在尝试创建一个侧边栏，但它没有出现在它应该的位置。相反，它显示在底部，单行显示我的内容。这是代码。我在共享文件夹中创建了_LayoutWithSidebar视图，该视图使用默认布局_Layout.cshtml。

@{
    ViewBag.Title = "_LayoutWithSidebar";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@section Featured{
    @RenderSection("Featured", required: false)
}

@section Scripts{
    @RenderSection("Scripts", required:false)
}

<div class="sidebar">
    @RenderSection("sidebar")
</div>

<div class="content">
    @RenderBody()
</div>

在site.css中

我添加了以下代码

.sidebar{
    width: 15em;
    margin: 1em;
    padding: 1em;
    min-height: 30em;
    float: left;
    background: #ccc;
    border: 1px inset #666; 
}

并在_Layout.cshtml中我使用@RenderSection("sidebar", required:false)

呈现了该部分

Index.cshtml看起来像这样

@model IEnumerable<Auction.Models.Auction>

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
    ViewBag.Title = "Index";
}
@section sidebar{
    This is a sidebar
}

@section Featured{
    <section class ="featured">
        <div class ="content-wrapper">
            This is some featured content
        </div>
    </section>
}

@section scripts
{
    <!--This content will be rendered in the Script section -->
}
<p>
    @Html.ActionLink("Create New", "Create")
</p>


@foreach (var item in Model)
{
    @Html.Partial("_AuctionTile", item)
}

任何想法为什么它不工作??? 在视图源代码显示

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Index - My ASP.NET MVC Application</title>
        <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
        <meta name="viewport" content="width=device-width" />
        <link href="/Content/site.css" rel="stylesheet"/>

        <script src="/Scripts/modernizr-2.6.2.js"></script>

    </head>
    <body>
        <header>
            <div class="content-wrapper">
                <div class="float-left">
                    <p class="site-title"><a href="/">your logo here</a></p>
                </div>
                <div class="float-right">
                    <section id="login">
                            <ul>
        <li><a href="/Account/Register" id="registerLink">Register</a></li>
        <li><a href="/Account/Login" id="loginLink">Log in</a></li>
    </ul>

                    </section>
                    <nav>
                        <ul id="menu">
                            <li><a href="/">Home</a></li>
                            <li><a href="/Home/About">About</a></li>
                            <li><a href="/Home/Contact">Contact</a></li>
                        </ul>
                    </nav>
                </div>
            </div>
        </header>
        <div id="body">

    <section class ="featured">
        <div class ="content-wrapper">
            This is some featured content
        </div>
    </section>

            <section class="content-wrapper main-content clear-fix">



<p>
    <a href="/auctions/Create">Create New</a>
</p>


<div class="auction-tile">
    <h4 class="title">Example auction #1</h4>
    <p class="end-date">Ends at 5/20/2013 2:01 PM</p>
    <p class="price">Price: $10.00</p>
</div> <div class="auction-tile">
    <h4 class="title">Example auction #2</h4>
    <p class="end-date">Ends at 5/20/2013 2:01 PM</p>
    <p class="price">Price: $8.00</p>
</div> <div class="auction-tile">
    <h4 class="title">Example auction #3</h4>
    <p class="end-date">Ends at 5/20/2013 2:01 PM</p>
    <p class="price">Price: $40.00</p>
</div>    

            </section>
        </div>
        <footer>
            <div class="content-wrapper">
                <div class="float-left">
                    <p>&copy; 2013 - My ASP.NET MVC Application</p>
                </div>
            </div>
        </footer>

        <script src="/Scripts/jquery-1.8.2.js"></script>


    <!--This content will be rendered in the Script section -->

    This is a sidebar


    </body>
</html>

侧栏出现在底部（MVC4）

0 个答案: