如何让100％的宽度asp.net菜单 [英] How can I make asp.net menu of 100% width
问题描述
我建立一个asp.net网站，我需要一个水平ASP菜单是全屏幕的宽度与各10％的宽度的10项
请提出一个解决方案，因为当我设置菜单的宽度为100％和里宽度10％的不完全宽度来了。
然而，当我设置菜单的宽度为1280（我的分辨率）和里宽度128，它工作正常。
有方法的问题是不是每个人都有相同的分辨率
HTML code asp.net菜单：
＆LT; DIV＆GT;
＆LT; ASP：菜单ID =NavigationMenu=服务器的CssClass =菜单
EnableTheming =FALSE的EnableViewState =假
IncludeStyleBlock =FALSE方向=横向WIDTH =1280px＆GT;
＆LT;项目＆GT;
＆LT; ASP：菜单项文本=HOMEVALUE =ADD CITYNavigateUrl =〜/ Content.aspx＆GT;＆LT; / ASP：菜单项＆GT;
＆LT; ASP：菜单项NavigateUrl =〜/ addcity.aspx文本=新城VALUE =增加城市＆GT;
＆LT; / ASP：菜单项＆GT;
＆LT; ASP：菜单项文本=新数据VALUE =提交数据NavigateUrl =〜/ adddata.aspx＆GT;＆LT; / ASP：菜单项＆GT;
＆LT; ASP：菜单项文本=SHOPINGVALUE =SHOPING＆GT;
＆LT; / ASP：菜单项＆GT;
＆LT; ASP：菜单项文本=优惠VALUE =提供了＆GT;＆LT; / ASP：菜单项＆GT;
＆LT; ASP：菜单项文本=BUSINESSVALUE =商＆GT;＆LT; / ASP：菜单项＆GT;
＆LT; ASP：菜单项文本=机密VALUE =机密＆GT;＆LT; / ASP：菜单项＆GT;
＆LT; ASP：菜单项文本=教育VALUE =教育＆GT;＆LT; / ASP：菜单项＆GT;
＆LT; ASP：菜单项文本=问题VALUE =问题＆GT;＆LT; / ASP：菜单项＆GT;
＆LT; ASP：菜单项文本=服务VALUE =服务＆GT;＆LT; / ASP：菜单项＆GT;
＆LT; /项目＆GT;
＆LT; / ASP：菜单＆gt;
＆LT; / DIV＆GT;
我试图使其非常格式化。现在，请大家帮忙。
这里是我的CSS
{
div.menu
{
保证金：0像素0像素0像素0像素;
填充：0像素0像素0像素0像素;
最小宽度：100％;
} div.menu UL
{
保证金：0像素0像素0像素0像素;
列表样式：无;
保证金：0像素;
填充：0像素;
最小宽度：100％;
} div.menu UL李一
{
背景颜色：黑色;
边框：0像素灰色固体;
颜色：白色;
显示：表细胞;
填充：10px的10px的;
文字修饰：无;
保证金：0像素0像素0像素0像素; }
div.menu李
{
文本对齐：中心;
} div.menu UL李一：悬停
{
背景颜色：＃B5B5B5;
颜色：黑色;
文字修饰：无;
} div.menu UL李一：主动
{
背景颜色：灰色;
颜色：黑色;
文字修饰：无;
}
div.menu UL李.selected
{
背景颜色：＃646464;
颜色：黑色;
文字修饰：无;
} }
您可以定义这样一个CSS类：
。菜单
{
宽度：100％;
}。菜单UL李
{ 宽度：10％;
}
之后设置菜单控件的下列财产在ASPX CSS类的名称。
的CssClass =菜单
I am building an asp.net website where I need a horizontal asp menu to be the full screen width with 10 items each of 10% width.
Please suggest a solution because when I set menu width to 100% and li width to 10 % it doesn't come in full width.
However when I set menu width to 1280(my resolution) and li width to 128 it works fine.
The problem with approach is not everyone has the same resolution
Html code of asp.net menu:
<div>
<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu"
EnableTheming="False" EnableViewState="False"
IncludeStyleBlock="False" Orientation="Horizontal" Width="1280px">
<Items>
<asp:MenuItem Text="HOME" Value="ADD CITY" NavigateUrl="~/Content.aspx"></asp:MenuItem>
<asp:MenuItem NavigateUrl="~/addcity.aspx" Text="NEW CITY" Value="ADD CITY">
</asp:MenuItem>
<asp:MenuItem Text="NEW DATA" Value="SUBMIT DATA" NavigateUrl="~/adddata.aspx"></asp:MenuItem>
<asp:MenuItem Text="SHOPING" Value="SHOPING">
</asp:MenuItem>
<asp:MenuItem Text="OFFERS" Value="OFFERS"></asp:MenuItem>
<asp:MenuItem Text="BUSINESS" Value="BUSINESS"></asp:MenuItem>
<asp:MenuItem Text="CLASSIFIED" Value="CLASSIFIED"></asp:MenuItem>
<asp:MenuItem Text="EDUCATION" Value="EDUCATION"></asp:MenuItem>
<asp:MenuItem Text="ISSUES" Value="ISSUES"></asp:MenuItem>
<asp:MenuItem Text="SERVICES" Value="SERVICES"></asp:MenuItem>
</Items>
</asp:Menu>
</div>
i tried to make it well-formatted. Now please help.
here is my css
{
div.menu
{
margin:0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
min-width:100%;
}
div.menu ul
{
margin:0px 0px 0px 0px;
list-style: none;
margin: 0px;
padding: 0px;
min-width:100%;
}
div.menu ul li a
{
background-color:Black;
border: 0px Gray solid;
color: White;
display:table-cell;
padding: 10px 10px;
text-decoration:none;
margin:0px 0px 0px 0px;
}
div.menu li
{
text-align:center;
}
div.menu ul li a:hover
{
background-color: #B5B5B5;
color: Black;
text-decoration: none;
}
div.menu ul li a:active
{
background-color: Gray;
color: Black;
text-decoration: none;
}
div.menu ul li .selected
{
background-color: #646464;
color: Black;
text-decoration: none;
}
}
You can define a Css class like this:
.Menu
{
width:100%;
}
.Menu ul li
{
width:10%;
}
After that set the following property of menu control to the name of CSS class in aspx.
CssClass="Menu"
这篇关于如何让100％的宽度asp.net菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
