0

必要に応じて、div タグ全体に広がっていないメニューがあります。私の div には menu の css クラスがあり、私の div タグには nav の css クラスがあります。メニューとナビゲーションを 100% 幅に設定してみましたが、何も問題が解決しません。何が正しくないかアドバイスしてください。

前もって感謝します!

menu
{
/* padding: 4px 0px 4px;*/

 z-index:99999;
 width:  100%;

}

.nav
{
 width: 90%;
 margin: 20px auto 0px auto;

 }

ここにHTMLがあります

<%@ Master Language="VB" AutoEventWireup="false" CodeFile="Site.Master.vb" Inherits="Site" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-    strict.dtd">


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head id="Head1" runat="server">
<title></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="Form1" runat="server">
<div class="nav">
    <div class="header">
        <div class="title">
            <h1>
                              <asp:ImageButton ID="ImageButton1" runat="server" 
                                  />
                              </h1>
        </div>
        <div class="loginDisplay">


            <asp:ImageButton ID="ImageButton2" runat="server" 
                />

        </div>
        <div class="clear hideSkiplink">
            <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" 
                Orientation="Horizontal" IncludeStyleBlock="False">
                <Items>
                    <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Test" 
                        Target="New Window">
                          </asp:MenuItem>
                    <asp:MenuItem NavigateUrl="~/About.aspx" Text="Test 2">

                    </asp:MenuItem>

                    </asp:MenuItem>
                </Items>
            </asp:Menu>
        </div>
    </div>
    <div>
        <asp:ContentPlaceHolder ID="MainContent" runat="server"/>
    </div>
    <div class="clear">


    </div>
</div>
<div class="footer">



</div>
</form>
</body>
</html>
4

2 に答える 2

0

position: absoluteまたはを使用している場合position: fixed( の使用によって暗示されますz-index)、左と右の値を設定して、要素がビューポート全体に広がるようにすることができます。

.menu {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
}

これには、全体の幅に影響を与えることなく、メニューにパディングを設定できるという利点があります。

于 2013-10-31T19:02:03.647 に答える
0

を使用しoverflow:auto;ます。これにより、メニューが伸びます。

例えば、

menu
{
/* padding: 4px 0px 4px;*/

 z-index:99999;
 width:  100%;
 overflow:auto;

}

お役に立てれば。

于 2013-10-31T18:55:59.620 に答える