0

私の画面は次のようになります。

ここに画像の説明を入力してください

ご覧のとおり、顧客情報と残高は私の_Layout.cshtmlの外に表示されています。

これは私の_Layout.cshtmlです:

<!DOCTYPE html>
<html>
<head>
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
  <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>

  <script>
    $(function () {
      $('.focus :input').focus();
    });
  </script>

</head>
<body>
    <div class="page">
        <div id="header">

            <div id="logindisplay">
                @Html.Partial("_LogOnPartial")
            </div>
            <div id="menucontainer">
              <ul id="menu">

                @if (User.Identity.IsAuthenticated)
                {
                  <li>@Html.ActionLink("Update Account", "UpdateAccount" , "Account")</li>
                  <li>@Html.ActionLink("Change Password", "ChangePassword", "Account")</li>
                  <li>@Html.ActionLink("Accounts", "CustomerSummary", "Customer")</li>
                }
                else
                { 
                  <li>@Html.ActionLink("Logon", "Logon", "Account")</li>
                  <li>@Html.ActionLink("Register", "Register", "Account")</li>                  
                }

                  <li>@Html.ActionLink("ContactUs", "ContactUs", "Home")</li>
              </ul>
            </div>
        </div>
        <div id="main">
            @RenderBody()
        </div>
        <div id="footer">
        </div>
    </div>
</body>
</html>

そして私のウェブページ:

@model SuburbanCustPortal.SuburbanService.CustomerData      

@{
    ViewBag.Title = "Account Screen";
 }

<h2>AccountScreen</h2>

<div class="leftdiv">
  <fieldset>
    <legend>customer info</legend>
    @Html.Partial("CustomerInfoPartialView", Model)
  </fieldset>
</div>

<div class="rightdiv">
    <fieldset> 
      <legend>balance</legend>
      <div>
        @Html.Partial("BalancePartialView", Model)
      </div>    
    </fieldset>
</div>

それが私のレイアウト内にとどまらない理由はありますか?

4

1 に答える 1

1

コンテナー内のフロートは、"クリア" div を使用しないと、コンテナーを最大の高さに拡張しません。<div id="main">たとえば、内部にクリア div が必要です。

<div id="main">
    @RenderBody()
    <div style="clear: both;"></div>
</div>

これを行う方法は他にもいくつかありますが、これが最も簡単です。

于 2012-11-16T19:33:12.107 に答える