Selected Dynamic Menu item

I am trying to set the background color of a selected item in a dynamic dropdown menu.  I have a 10px horizontal padding on for the dropdown menu.  Some of the options in the menu are longer in word length.  I want to set the background color of a selected item across the entire width of the dropdown including the padding.  I have also tried setting padding in my css style sheet left and right but it doesn't give the desired effect because of the longer worded menu items.  At the moment I am only able to set the background color of the word itself in the dropdown menu.  On selected item the horizontal-padding goes back to 0 to incorporate the css padding.  I know this isn't the final solution but the issue still remains.  Any ideas?

Style sheet

.menubk TD /* Defines the entire menu background table */
{
  background-color:#2A2B64;
}
.menudynbkfor a /* Defines the top menu color and 'a' to override link default*/
{
  background-color:#2A2B64;
  color:#FFFFCC;
}
.menudynbk_select a /* Defines the dynamic selected item of menu color and 'a' to override link default*/
{
  background-color:#FFFFCC;
  color:#2A2B64;
  padding-left:10px;
  padding-right:10px;
}
.menudynbk TD /* Defines the dynamic dropdown menu color and 'TD' to override inherited table*/
{
  background-color:#2A2B64;
}


VB.Net Code

<asp:Menu ID="mnu" runat="server" CssClass="menudynbkfor"
                       DynamicEnableDefaultPopOutImage="False" DynamicHorizontalOffset="33" 
                        Orientation="Horizontal" StaticMenuItemStyle-HorizontalPadding="25" StaticEnableDefaultPopOutImage="False"
                        style="font-family: Arial, Helvetica, sans-serif">
                        <DynamicMenuItemStyle CssClass="menudynbkfor" HorizontalPadding="10px" ItemSpacing="5px" />
                        <DynamicMenuStyle CssClass="menudynbk" />
                        <DynamicSelectedStyle CssClass="menudynbk_select" HorizontalPadding="0px" />
                        <Items>
                            <asp:MenuItem Text="Publication" Value="Publication" Selectable="False">
                            <asp:MenuItem Text="Operational" Value="Operational"></asp:MenuItem>
                            <asp:MenuItem Text="System" Value="System"></asp:MenuItem>
                            <asp:MenuItem Text="Services" Value="Services"></asp:MenuItem>
                            </asp:MenuItem>
                            <asp:MenuItem Text="Rules" Value="Rules" Selectable="False">
                                <asp:MenuItem Text="Operational" Value="Operational" 
                                    ></asp:MenuItem>
                                <asp:MenuItem Text="Interface" Value="Interface"></asp:MenuItem>
                            </asp:MenuItem>
                            <asp:MenuItem Text="Interfaces" Value="Interfaces" Selectable="False">
                                <asp:MenuItem Text="System" Value="0"></asp:MenuItem>
                                <asp:MenuItem Text="System Pairs" Value="1"></asp:MenuItem>
                                <asp:MenuItem Text="Messages / Templates" Value="2">
                                </asp:MenuItem>
                                <asp:MenuItem Text="Elements" Value="3"></asp:MenuItem>
                            </asp:MenuItem>
                            <asp:MenuItem Text="Services" Value="Services" Selectable="False">
                            <asp:MenuItem Text="Providers" Value="Providers"></asp:MenuItem>
                            <asp:MenuItem Text="Services" Value="Services"></asp:MenuItem>
                            </asp:MenuItem>
                            <asp:MenuItem Text="Data Dictionary" Value="Data Dictionary"></asp:MenuItem>
                            <asp:MenuItem Text="Glossary" Value="Glossary" Selectable="False">
                                <asp:MenuItem Text="Acronyms" Value="Acronyms" ></asp:MenuItem>
                                <asp:MenuItem Text="Terminology" Value="Terminology"></asp:MenuItem>
                            </asp:MenuItem>
                        </Items>
                    </asp:Menu>


 

thoughts on "Selected Dynamic Menu item"

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>