您正在使用从数据库获取动态菜单的网站。我的问题是菜单不是中心对齐的。它只显示在它的托管div的左上角。以下是代码:
<div class="row">
<div class="col-md-2 col-lg-2 col-sm-2 col-xs-12">
<asp:Image ID="Image1" runat="server" ImageUrl="~/images/offerboxindialogo9.png" class="img img-responsive"/>
</div>
<div class="col-md-8 col-lg-8 col-sm-8 col-xs-12">
<div class="navbar">
<asp:Menu ID="NavigationMenu" runat="server" class="mymenu" DynamicHorizontalOffset="2" Font-Bold="True" Font-Names="Verdana"
Font-Size="Smaller" ForeColor="white" Orientation="Horizontal" StaticSubMenuIndent="10px"
StaticEnableDefaultPopOutImage="false" DynamicEnableDefaultPopOutImage="false"
RenderingMode="List" Width="100%">
<DataBindings>
<asp:MenuItemBinding DataMember="Item" NavigateUrlField="url" TextField="Text" ValueField="Value" />
<asp:MenuItemBinding DataMember="SubItem" NavigateUrlField="url" TextField="Text" ValueField="Value" />
</DataBindings>
<DynamicHoverStyle BackColor="purple" ForeColor="White" />
<DynamicMenuItemStyle HorizontalPadding="10px" VerticalPadding="10px" ForeColor="purple" BackColor="White"/>
<DynamicMenuStyle BorderWidth="2px" BorderColor="#990000" ForeColor="purple" />
<DynamicSelectedStyle BackColor="#FFCC66" />
<StaticHoverStyle BackColor="purple" ForeColor="White" CssClass="hoverstyle" />
<StaticMenuItemStyle HorizontalPadding="10px" VerticalPadding="10px" />
<StaticSelectedStyle BackColor="#FFCC66" />
</asp:Menu>
</div>
</div>
<div class="col-md-2 col-lg-2 col-sm-2 col-xs-12">
</div>
</div>
我已尝试过css中的所有内容,包括float:none,display:inline,Center标记,vertical-align:middle,甚至尝试使用以下我在堆栈溢出的类似帖子中作为答案:
.mymenu>ul>li>a
{
line-height: 50px;
}
也试过了 .mymenu ul li a { line-height:50px; } 并尝试过 .mymenu + ul + li a { line-height:50px; } 但没有什么能完美的。这三次尝试中的第一次尝试的问题是它也影响了下拉菜单项。
<div class="row">
<div class="col-md-2 col-lg-2 col-sm-2 col-xs-12">
<img id="Image1" class="img img-responsive" src="images/offerboxindialogo9.png" />
</div>
<div class="col-md-8 col-lg-8 col-sm-8 col-xs-12">
<div class="nav navbar-nav">
<a href="#NavigationMenu_SkipLink"><img alt="Skip Navigation Links" src="" width="0" height="0" style="border-width:0px;" /></a><div class="mymenu" id="NavigationMenu">
<ul class="level1">
<li><a class="level1" href="#" >Home</a></li><li><a class="level1">Shopping</a><ul class="level2">
<li><a class="level2">Electronics</a><ul class="level3">
</ul></li><li><a class="level2">MEN</a><ul class="level3">
<li><a class="level3" href="#" >Mobile & Tablets</a></li><li><a class="level3" href="#" >Computer & Laptop</a></li><li><a class="level3" href="#" >Mobile & Computer Accessories</a></li><li><a class="level3" href="#" >TVs & Camera</a></li><li><a class="level3" href="#" >TVs & Camera Accessories</a></li><li><a class="level3" href="#" >Wearables</a></li><li><a class="level3" href="#" >Network Components</a></li><li><a class="level3" href="#" >Home Entertainment</a></li><li><a class="level3" href="#" >Air Conditioners</a></li><li><a class="level3" href="#" >Refrigerators</a></li><li><a class="level3" href="#" >Washing Machine</a></li><li><a class="level3" href="#" >Kitchen Appliances</a></li><li><a class="level3" href="#" >Small Home Appliances</a></li><li><a class="level3" href="#" >More</a></li>
<li><a class="level3" href="#" >Footwear</a></li><li><a class="level3" href="#" >Clothing</a></li><li><a class="level3" href="#" >Watches</a></li><li><a class="level3" href="#" >Accessories</a></li><li><a class="level3" href="#" >Personal Care Appliances</a></li><li><a class="level3" href="#" >Grooming</a></li><li><a class="level3" href="#" >Featured</a></li>
</ul></li><li><a class="level2">WOMEN</a><ul class="level3">
<li><a class="level3" href="#" >Clothing1</a></li>
</ul></li><li><a class="level2" href="#" >BABY & KIDS</a></li>
</ul></li><li><a class="level1" href="#" >Festive Offers</a></li>
</ul>
</div><a id="NavigationMenu_SkipLink"></a>
</div>
</div>
<div class="col-md-2 col-lg-2 col-sm-2 col-xs-12">