CODEWITHSUNDEEP
c#asp.netcss
Jed
Jed

Reputation: 1043

Asp.net Menu remove bullets

I cannot get rid of the bullets. I have tried to use the liststyle equals none to no avail Any Suggestions.This is my html

<asp:Menu ID="SiteMainMenu"  runat="server" StaticMenuItemStyle-CssClass="menuItemS"
                        StaticHoverStyle-BackColor="#F8941C" DynamicMenuItemStyle-CssClass="menuItemD"
                        DynamicHoverStyle-CssClass="DynamicStyle" DynamicHorizontalOffset="10" DynamicVerticalOffset="4"
                        DynamicMenuItemStyle-Height="20" DynamicHoverStyle-BackColor="#FAA53D" EnableViewState="false"
                        IncludeStyleBlock="false" Orientation="Horizontal" Width="100%">
                        <Items>
                            <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"></asp:MenuItem>
                            <asp:MenuItem NavigateUrl="~/Pages/graphs/monthlyservicesales.aspx" Text="Graphs">
                            </asp:MenuItem>
                            <asp:MenuItem Text="Reports">
                                <asp:MenuItem NavigateUrl="~/Pages/reports/monthlyservicetypesalesmoneyreport.aspx"
                                    Text="Daily Sales"></asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/Pages/reports/monthlyservicetypesalesmoneyreport.aspx"
                                    Text="Reports"></asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/Pages/reports/monthlyservicetypesalesmoneyreport.aspx"
                                    Text="Reports"></asp:MenuItem>
                            </asp:MenuItem>
                        </Items>
                    </asp:Menu>

and this is my css that controls the menu.It works nicely except for the bullets that are displayed.

   .AdminMenu 
{
    height: 30px;
    width: 100%;
    margin-top:-129px;
    padding-top:3px;
    background:url(../Images/subHeaderBg.png) repeat-x;
}
#AdminMenuItems
{
    color:#000;
    width:960px;
    margin:0 auto;
    font-weight:700;
    font-size:11px;
    padding-top:5px;
    padding-left:8px;
    list-style:none;
}

Upvotes: 0

Views: 2879

Answers (3)

talha2k
talha2k

Reputation: 1

You should use list-style:none for menu ul, not for menu items.

something like this:

#SiteMainMenu ul
{
    height: 30px;
    width: 100%;
    margin-top:-129px;
    padding-top:3px;
    background:url(../Images/subHeaderBg.png) repeat-x;
    list-style:none;
}

In your html your menuid is SiteMainMenu not AdminMenu.

Hope this helps.

Upvotes: 0

Saeed Neamati
Saeed Neamati

Reputation: 35842

First of all, you should use ClientIDMode='Static' in your markup, to get sure that SiteMainMenu would be the real id of the corresponding HTML element. Then, you can use everything selector to override the default behavior of list items style beneath this element:

#SiteMainMenu *
{
   list-style: none; // A simple CSS reset in the scope of SiteMainMenu element
}

Upvotes: 0

Fredrik M&#246;rk
Fredrik M&#246;rk

Reputation: 158319

It looks like the menu does not use the styles that you have defined; none of the properties refer to #AdminMenuItems as far as I can tell.

Upvotes: 1

Related Questions