1

同じ正確なcssおよびaspコードをコピーして別のプロジェクトに貼り付けましたが、CSSはasp：menuコントロールに移動せず、理解できません。また、ソースを表示すると、メニューは独自のスタイルブロックを作成しています。

簡単にサポートできるようにしました。以下の全ページコードとCSSをコピーして貼り付けるだけです。ヘルプは大歓迎です。

これが完全なaspxページです：

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="testing.aspx.vb" Inherits="eCASVS2005.testing" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolKit" %>

<!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="eCASScripts/cssMasterPage.css" rel="stylesheet" type="text/css" />
<% If False Then%> <!-- fix for seeing css in design view and handling url after deployed -->
<link href="<%= Page.ResolveUrl("~/eCASScripts/cssMasterPage.css")%>" rel="stylesheet" type="text/css" />
<% End If%>

</head>

<body>

<form id="Form1" runat="server" enctype="multipart/form-data" method="post">

<div class="page">
    <div class="header left">
        <div class="title left">
            <h1>
                MLG Dispatch Manager
            </h1>
        </div>
        <div class="left">
            <asp:Menu ID="NavigationMenu" 
            runat="server" 
            CssClass="myMenu" 
            EnableViewState="false" 
            IncludeStyleBlock="false" 
            Orientation="Horizontal">
                <Items>
                    <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"/>
                    <asp:MenuItem NavigateUrl="" Text="Dispatch">
                        <asp:MenuItem NavigateUrl="~/Dispatch/NewDispatchEntry.aspx" Text="New Entry" />
                        <asp:MenuItem NavigateUrl="~/Dispatch/SearchDispatchEntries.aspx" Text="Find Existing" />
                        <asp:MenuItem NavigateUrl="~/Dispatch/ViewDispatchHistory.aspx" Text="View History" />
                    </asp:MenuItem>
                    <asp:MenuItem NavigateUrl="" Text="Maintenance">
                        <asp:MenuItem NavigateUrl="~/Maintenance/EditTrailers.aspx" Text="Edit Trailers" />
                        <asp:MenuItem NavigateUrl="~/Maintenance/EditCarriers.aspx" Text="Edit Carriers" />
                        <asp:MenuItem NavigateUrl="~/Maintenance/EditDrivers.aspx" Text="Edit Drivers" />
                    </asp:MenuItem>
                    <asp:MenuItem NavigateUrl="~/UnderConstruction.aspx" Text="Help"/>
                </Items>
            </asp:Menu>
        </div>
        <div id="loggedInText" class="loginDisplay right" runat="server">
            logged in: [User Name]
        </div>
    </div>

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

そしてここに完全なCSSがあります：

/* DEFAULTS
----------------------------------------------------------*/


body   
{
    background: #b6b7bc;
    font-size: .80em;
    font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
    margin: 0px;
    padding: 0px;
    color: #696969;
    height:100%;
}

a:link, a:visited
{
    color: #034af3;
}

a:hover
{
    color: #1d60ff;
    text-decoration: none;
}

a:active
{
    color: #034af3;
}

p
{
    margin-bottom: 10px;
    line-height: 1.6em;
}

table
{
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
}

/* HEADINGS   
----------------------------------------------------------*/

h1, h2, h3, h4, h5, h6
{
    font-size: 1.5em;
    color: #666666;
    /* font-variant: small-caps; */
    text-transform: none;
    font-weight: 200;
    margin-bottom: 0px;
}

h1
{
    font-size: 1.5em;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

h2
{
    font-size: 1.5em;
    font-weight: 600;
}

h3
{
    font-size: 1.2em;
}

h4
{
    font-size: 1.1em;
}

h5, h6
{
    font-size: 1em;
}

/* this rule styles <h1> and <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
    margin-top: 0px;
}

.state
{
    width:116px;
}


/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

.page
{
    width: 1020px;
    background-color: #fff;
    margin: 40px auto 0px auto;
    border: 1px solid #496077;
}

.widthFullPx
{
    width: 900px;
}

.header
{
    position: relative;
    margin: 0px;
    padding: 0px;
    background: #4b6c9e;
    width: 100%;
}

.header h1
{
    font-weight: 700;
    margin: 0px;
    padding: 0px 0px 0px 20px;
    color: #f9f9f9;
    border: none;
    line-height: 2em;
    font-size: 1.5em;
}

.main
{
    padding: 0px 12px;
    /*min-height:500%;*/
    min-height:100%;
    margin-right: 8px;
    margin-top: 10px;
    margin-bottom: 8px;
}

.leftCol
{
    padding: 6px 0px;
    margin: 12px 8px 8px 8px;
    width: 200px;
    min-height: 200px;
}

.footer
{
    color: #4e5766;
    padding: 8px 0px 0px 0px;
    margin: 0px auto;
    text-align: center;
    line-height: normal;
}

#headerSeparator
{
    background-color:White;
    width:1px;
    height:35px;
    margin:0px 0px 0px 10px;
}


/* TAB MENU   
----------------------------------------------------------*/

div.myMenu > ul > li
{ 
    display: inline-block;
    list-style: none; 
} 

div.myMenu ul li ul 
{ 
    display: none; 
}

div.hideSkiplink
{
    background-color:#3a4f63;
    width:100%;
}

div.myMenu
{
    padding: 5px 0px 5px 40px;
}

div.myMenu ul
{
    list-style: none;
    margin: 0px;
    padding: 0px;
    width: auto;
}

div.myMenu ul li a, div.myMenu ul li a:visited
{
    background-color: #465c71;
    border: 1px #4e667d solid;
    color: #dde4ec;
    display: block;
    line-height: 1.35em;
    padding: 4px 20px;
    text-decoration: none;
    white-space: nowrap;
}

div.myMenu ul li a:hover
{
    background-color: #bfcbd6;
    color: #465c71;
    text-decoration: none;
}

div.myMenu ul li a:active
{
    background-color: #465c71;
    color: #cfdbe6;
    text-decoration: none;
}

/* FORM ELEMENTS   
----------------------------------------------------------*/

fieldset
{
    margin: 1em 0px;
    padding: 1em;
    border: 1px solid #ccc;
}

bolFieldSet 
{
    background-color:Fuchsia;
    margin: 1em 0px 1 0;
    padding: 0em;
    border: 1px solid #ccc;
}

fieldset p 
{
    margin: 2px 12px 10px 10px;
}

fieldset.login label, fieldset.register label, fieldset.changePassword label
{
    display: block;
}

fieldset label.inline 
{
    display: inline;
}

legend 
{
    font-size: 1.1em;
    font-weight: 600;
    padding: 2px 4px 8px 4px;
}

input.textEntry 
{
    width: 320px;
    border: 1px solid #ccc;
}

input.passwordEntry 
{
    width: 320px;
    border: 1px solid #ccc;
}

div.accountInfo
{
    width: 42%;
}

/* MISC  
----------------------------------------------------------*/

.hidden{display: none;}

.autowidth
{
    width:auto;
}

.width100pct
{
    width:100%;
}

.largetext
{
    font-size:large;
}

.medtext
{
    font-size:medium;
}

.clear
{
    clear: both;
}

.center
{
    text-align: center;
    vertical-align:middle;
}

.left /* floats left */
{
    float:left;
}

.right /* floats right */
{
    float:right;
}

私が言ったように、これとまったく同じコードが別のプロジェクトで機能しているので、これを理解することはできません。それぞれに同じcssバージョン、2.1。ありがとう。-テイラー

4

1 に答える 1

3

ここのユーザーからのいくつかのガイダンスのおかげで問題を見つけました。メニューコントロール要素を調べた後、それはと<table>してレンダリングされていましたが、私がこれまでにこのコントロールを使用した他のすべてのプロジェクトは、<div>

同じ状況にある他の誰かとのリンクは次のとおりです。

http://forums.asp.net/t/1613711.aspx

私にとっての簡単な解決策は、プロパティRenderingMode="List"をasp：menuに追加することでしたが、それで問題が修正されました。

助けてくれたすべての人に感謝します。

于 2013-03-22T16:17:37.490 に答える