0

CSS に問題があり、2 つの div が互いに影響し合っています。二人とも隣にいて欲しい。

ユーザーメニューとコンテンツ div を内部に備えたボディを持っています。

HTML:

<div id="body">
            <div id="user-menu">
                @if (Request.IsAuthenticated)
                { 
                    <ul id="account-menu">
                        <li>@Html.ActionLink("My profile", "MyProfile", "Profile")</li>
                        <li>@Html.ActionLink("Links", "Links", "Profile")</li>
                        <li>@Html.ActionLink("History", "History", "Profile")</li>
                        <li>@Html.ActionLink("Credits", "Credits", "Profile")</li>
                        <li>@Html.ActionLink("Settings", "Manage", "Account")</li>
                    </ul>  
                }
            </div>
            <div id="content">
                @RenderBody()
            </div>
        </div>
        <div id="footer">
            <p>&copy; @DateTime.Now.Year - Immo QR by eNetricity.com</p>
        </div>
    </div>

CSS:

#body 
{

margin: 0 auto;
max-width: 960px;

}

#user-menu 
{
float: left;
width: 15%;

}

#content 
{
float: right;
width: 85%;

}

画像：

あいさつ

4

3 に答える 3

0

マティアス、不必要に div を閉じました。削除してください。また、両方のdivにfloat leftを与えます。

于 2013-09-04T15:23:43.103 に答える
0

問題の解決に役立つ 2 つのことが頭に浮かびます。

  1. 右フローティング<div>は左フローティングの後に来るため、<div>フローティングの前に次の行に移動している可能性があります。両方の要素を左に浮かせてみてください。
  2. ブラウザは、サイズを計算するときに最も近いピクセルに切り上げることがあります。あなたのコードは 10/90 分割でうまく機能しますか? 20/80? コンテナー全体が 960px の場合は、列のサイズを手動でピクセル単位で計算してみてください。
于 2013-09-04T15:24:25.193 に答える