How to set total menu width 100% Fixed(Screenwirdth) always

Question

0.00/5 (No votes)

See more:

Hi,

I have the menu. it contains Home,Master,Transaction,etc.

Based on my roles i will do certain menu's are hiding.

But, my menu width should be 100% fixed in Screen in all the cases.

How to do this...?

see my menu
-----------

ASP.NET

<asp:Menu ID="Menu1" runat="server" Orientation="Horizontal" RenderingMode="List">            
            <Items>
                <asp:MenuItem NavigateUrl="~/Home.aspx"  Text="Home" Value="Home"  />
                <asp:MenuItem  Text="Master" Value="first"> 
                        <asp:MenuItem  Text="Admin" Value="Admin"></asp:MenuItem> 
                        <asp:MenuItem Text="Prod" Value="Pro"></asp:MenuItem> 
                        <asp:MenuItem  Text="MaP" Value="Mr"></asp:MenuItem> 
                        <asp:MenuItem Text="Cory" Value="Cy"></asp:MenuItem> 
                        <asp:MenuItem Text="Ponal" Value="ap"></asp:MenuItem> 
                </asp:MenuItem> 
                <asp:MenuItem  Text="Transaction" Value="Second"> 
                        <asp:MenuItem  Text="Dment Activities" Value="DX"></asp:MenuItem> 
                        <asp:MenuItem Text="put" Value="SA"></asp:MenuItem> 
                        <asp:MenuItem Text="Powr" Value="KP"></asp:MenuItem> 
                </asp:MenuItem> 
                 <asp:MenuItem  Text="Reports" Value="Third"> 
                        <asp:MenuItem  Text="Reports" Value="Reports"></asp:MenuItem> 
                        <asp:MenuItem  Text="Power" Value="AL"></asp:MenuItem> 
                        <asp:MenuItem Text="All" Value="XY"></asp:MenuItem> 
                </asp:MenuItem> 
                <asp:MenuItem NavigateUrl="~/arts.aspx"  Text="arts" Value="charts"  />
            </Items>
        </asp:Menu>

Posted 14-Dec-11 19:04pm

gani7787

Updated 14-Dec-11 19:08pm

v3

Add a Solution

Comments

Karthik Harve 15-Dec-11 1:08am

Edit : Added pre tags.

2 solutions

Solution 1

Add these two tags inside menu tag..

HTML

<staticmenustyle width="100%" />
<staticmenuitemstyle width="100%" />

hope it helps..

Posted 14-Dec-11 19:13pm

Karthik Harve

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

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

Balakrishnan Dhinakaran · Accepted Answer · 2011-12-14T19:22:00

Solution 2

<asp:menu id="Menu1" runat="server" orientation="Horizontal" renderingmode="List" width="100%"></asp:menu>

make sure that you don't specify any width for parent tag of this asp:menu so that menu will displayed with the width of screen width.

Use menu in Master page so that it will be displayed common to all its content pages

Posted 14-Dec-11 19:22pm

Balakrishnan Dhinakaran

Updated 14-Dec-11 19:25pm

v3

Comments

gani7787 15-Dec-11 1:53am

I am using css style. based on that i have set the width for every menu.
But, if i remove one more menu items then also i want to display the menu width fixed..

li
{
border:1px solid black;
padding:2px 2px 2px 2px;
width:210px;
background-color:#82C0FF;
color:black;
cursor:pointer;
}
a { color:black; font: bold 11px Verdana; }