Click here to Skip to main content
15,944,737 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I am using a dynamic menu where the menu item is brought from database... In order to separate the menu item in root menu, i am using separator image that is a bar image.. i want a separator image to extend throughout the top and bottom vertically touching border of menu bar between menu items making each item of menu to appear like being in a cell. the aspx for menu bar is shown below:

XML
<asp:Menu ID="menuBar" runat="server" Orientation="Horizontal" MaximumDynamicDisplayLevels="5"
                         DynamicHorizontalOffset="1" DynamicVerticalOffset="1" StaticTopSeparatorImageUrl="~/Includes/Images/mSeparatorHor.gif" CssClass="menuHeader" >


                           <StaticMenuItemStyle Font-Names="Tahoma" Font-Bold= "false" ForeColor="White" CssClass="StaticMenuItemStyle" />

                           <StaticHoverStyle ForeColor="White" />

                           <DynamicMenuItemStyle Font-Bold="false" BorderColor="White" BorderWidth="1px" CssClass="DynamicMenuItemStyle" />

                           <DynamicMenuStyle BackColor="WhiteSmoke"/>

                           <DynamicHoverStyle BackColor="LightGray" Width="220px" />

                       </asp:Menu>



I had used css to control the image height as shown below:
CSS
.menuHeader
{
    padding-top: 5px;
    padding-right: inherit;
    padding-bottom: inherit;
    padding-left: inherit;
    height: 20px;
    font-size: 13px;
    background-image: url('../../Images/menuBar.gif');
}

.menuHeader img
{
     height: 20px;
}   /**  height of separator */




On increasing height of menuheader image, the height of separator is increased ignoring the height defined in menuheader.. can anyone help me in how to solve it or help me in alternate way to solve this??
Posted
Comments
Sergey Alexandrovich Kryukov 22-Oct-13 1:39am    
Of course it is ignored when the image gets less room than it is needed to fit all the image. Don't you think the whole idea of using such image is wrong? Imagine that it is not 20px, but 1 or 2px. Would you how that the image will be re-sampled to this height? :-)
(Even though it's possible that the image is clipped to your height, I think it would defeat the purpose of such image.)
—SA

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900