Travis
Travis

Reputation: 1095

ASP.Net Menu CSS Not Applying

I recently converted my web app from VB to C#. There is one remaining issue - after the conversion, the CSS applied to the navigation menu in my Site.Master is no longer working. It's behaving as though there is no CSS at all.

I have done the following:

So my question is this: Is there somewhere in an ASP.Net Web Application where CSS can be disabled for only some parts of an app?

This issue only occurs now, after the conversion, and the syntax is valid in other web projects, so it seems to me that it MUST have switched something in the application itself that is breaking it.

Here's my code, somewhat cleaned up:

My markup:

<head id="Head1" runat="server">
    ...
    <link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
    ...
</head>
<body>
...
    <asp:Menu ID="Menu1" runat="server" CssClass="menu" EnableViewState="False" IncludeStyleBlock="False"
                Orientation="Horizontal" StaticDisplayLevels="1">
        <Items>
            <asp:MenuItem Text="PTS Home" Value="PTS Main" NavigateUrl="Default.aspx">...</asp:MenuItem>
            <asp:MenuItem Text="Admin" Value="Admin">...</asp:MenuItem>
            <asp:MenuItem Text="Estimating" Value="Estimating">...</asp:MenuItem>
            <asp:MenuItem Text="Purchasing" Value="Purchasing">...</asp:MenuItem>
            <asp:MenuItem Text="Commissions" Value="Commissions">...</asp:MenuItem>
            ...
        </Items>
    </asp:Menu>
</body>

My CSS:

div.menu
{
    padding: 0px 0px 0px 0px;
    background-color: #507F6D;
    z-index: 1;
}

div.menu ul
{
    list-style: none;
    margin: 0px;
    padding: 1px;
    width: auto;
    z-index: 1;
}

div.menu ul li a:active
{
    background-color: #37725C; 
    color: #cfdbe6;
    text-decoration: none;
    z-index: 1;
}

What it should look like

Correct appearance

What it actually looks like

Incorrect appearance

Upvotes: 0

Views: 2291

Answers (3)

Travis
Travis

Reputation: 1095

Found the answer, thanks to Pete's comments steering me in the right direction.

The control's RenderingMode was set to "Default" - evidently, in VB the default behavior is List, but in C# it's Table. Div CSS is useless on items, so no formatting. Set it to List and magic!

Upvotes: 1

theLaw
theLaw

Reputation: 1291

Remove the div. in your CSS, i think that the control doesn't create a div

http://msdn.microsoft.com/en-US/en-en/library/ms366731(v=vs.100).aspx

Upvotes: 0

Kaptan
Kaptan

Reputation: 336

div.menu
{
    padding: 0px 0px 0px 0px;
    background-color: #507F6D;
    z-index: 1;
}

div.menu ul
{
    list-style: none;
    margin: 0px;
    padding: 1px;
    width: auto;
    z-index: 1;
}

div.menu ul li a
{
    background-color: #37725C; 
    color: #cfdbe6;
    text-decoration: none;
    padding: 0 5px;
    border: 1px solid greenyellow;
}

div.menu ul li a:active
{
    background-color: #37725C; 
    color: #cfdbe6;
    text-decoration: none;
    z-index: 1;
}

Upvotes: 0

Related Questions