У меня есть горизонтальное меню asp в div. Div устанавливается равным ширине: 100%, которая заполняет ширину страницы, однако, когда страница может быть горизонтально прокручена, div не распространяется до конца страницы. Я попытался установить минимальную ширину%: 100%; в CSS div, однако это не имеет значения. Может ли кто-нибудь помочь мне решить эту проблему, сообщив мне, как сделать div заполнять ширину страницы, когда страница может быть горизонтальной прокруткой. Я использую CSS 2.1 и ASP.NET 2.0
Код для div:
<div class="clear hideSkiplink">
<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" Orientation="Horizontal">
<staticmenuitemstyle ItemSpacing="30"/>
<StaticHoverStyle BackColor="DarkGray" BorderColor="Black" BorderStyle="Solid" BorderWidth="1"></StaticHoverStyle>
<Items>
<asp:MenuItem NavigateUrl="~/Home.aspx" Text="Home"/>
<asp:MenuItem NavigateUrl="~/Report.aspx" Text="Report an Operational Risk"/>
<asp:MenuItem NavigateUrl="~/View.aspx" Text="View Reported Operational Risks"/>
<asp:MenuItem NavigateUrl="~/UpdateClose.aspx" Text="Update/Close a Case"/>
</Items>
</asp:Menu>
</div>
CSS для div и меню:
.hideSkiplink
{
background-color:#FF9900;
width:100%;
float:left;
}
.menu
{
padding: 4px 0px 4px 12px;
}
.menu ul
{
list-style: none;
margin: 0px;
padding: 0px;
width: auto;
}
.menu ul li a, div.menu ul li a:visited
{
background-color: #FF9900;
color: #000000;
font-weight: bold;
font-size:14px;
display: block;
line-height: 1.35em;
padding: 4px 20px;
text-decoration: none;
white-space: nowrap;
}
.menu ul li a:hover
{
background-color: #bfcbd6;
color: #465c71;
text-decoration: none;
}
.menu ul li a:active
{
background-color: #465c71;
color: #cfdbe6;
text-decoration: none;
}
Я поместил gridview в прокручиваемый div, чтобы страница имела фиксированную ширину.