ここに問題を最もよく説明する図があり
ます。コンテンツに小さなアイテムしかない場合、サイドバーがコンテンツとフッターに重なっています。
私の_layoutでは、このようにサイドバーを呼び出しています
<body>
<div class="page">
<div id="header">
<div id="menucontainer">
<ul id="nav">
MENUTABS
</ul>
</div>
</div>
<div id="main">
<div id = "sidebar">
@if (IsSectionDefined("SideBar"))
{
@RenderSection("SideBar", required: false)
}
else {
<p>Currently Unavailable, Sorry for the inconvinience</p>
}
</div>
@RenderBody()
</div>
<div id="footer">
<div id="copyright">FOOTER</div>
</div>
</div>
</body>
次に、私のビューでは、このように呼び出しています
@section SideBar
{
@{Html.RenderAction("Index", "Post");}
}
ここに私のCSSがあります
.page {
width: 90%;
margin-left: auto;
margin-right: auto;
}
#main
{
clear: both;
padding: 10px 10px 10px 10px;
background-color: #fff;
}
#sidebar
{
float:left;
margin:200px 10px -30px 10px;
padding:10px -10px -10px 10px;
width:235px;
height:auto;
border: solid 2px black;
background-color:#9acbba;
}
footer,
#footer {
background-color: #fff;
color: #999;
padding: 10px 0;
text-align: center;
line-height: normal;
margin: 0 0 30px 0;
font-size: .9em;
-webkit-border-radius: 0 0 4px 4px;
-moz-border-radius: 0 0 4px 4px;
}
この問題の原因が何であるかを理解するのを手伝ってください。ありがとうT_T