当我调整窗口大小菜单不保持固定时



每当我调整窗口大小时,我都无法保持菜单修复,我的菜单不会保持固定,并且它一直向左移动。我希望我的所有文本,图片和菜单保持固定,但可以在一定程度上移动,之后它应该像其他网站一样可滚动。 我正在分享屏幕截图,当我滚动网页时会发生什么:

这就是当它最大化时的方式,这很好

这是当它最小化所有文本时,菜单按钮会移动但不会停留在原处。

我正在为您分享脚本:

.auto-style19 {
color: Highlight;
font-size: 18pt;
position: relative;
width:672px;
display: inline-block;
float: right;
margin-right: 10% auto;
font-family: 'Times New Roman', Times, serif;
top: 49px;
min-height: 196px;
margin-top: 0px;
left: -21px;
height:auto;
}
.auto-style26 {
position:relative;
min-width: 80%;
width:auto;
top: 0px;
left: 0px;
min-height: 505px;
overflow:hidden;
height:auto;
display:block;
}
.auto-style34 {
position: absolute;
left: 64px;
float: left;
width: 500px;
top: 14px;
}
.auto-style36 {
width: 677px;
}
<div style="margin-top:40px;margin:auto;" class="auto-style26">
<div style="display:inline-block;margin-top:50px;margin-right:20px;" class="auto-style34" >
<asp:Image ID="Image1" runat="server" height="300px" width="200px" CssClass="img1"/>
&nbsp; &nbsp;
<asp:Image ID="Image2" runat="server" height="300px" width="200px" />
</div>
<div class="auto-style19" >
<table class="auto-style36">
<tr><td class="auto-style28">  <asp:Label ID="Label2" runat="server" ForeColor="Highlight" style="text-transform:capitalize;" Font-Size="14pt" Text="Address: " Font-Bold="True"></asp:Label></td>
<td class="auto-style29"> <asp:Label ID="LabelAddress" runat="server" ForeColor="White" style="text-transform:capitalize;" Font-Size="13pt" ></asp:Label></td>
<td rowspan:3 class="auto-style27"><ul id="edit"><li> <a id="edit1" href="#" runat="server"  >Edit Info</a>
<ul>
<li><asp:HyperLink ID="HyperLink1" runat="server"  Font-Size="16pt" Font-Underline="false" NavigateUrl="~/EditPic1.aspx">Edit Profile Pic 1</asp:HyperLink></li>
<li><asp:HyperLink ID="HyperLink2" runat="server"  Font-Size="16pt" Font-Underline="false" NavigateUrl="~/EditPic2.aspx">Edit Profile Pic 2</asp:HyperLink></li>
<li><asp:HyperLink ID="HyperLink3" runat="server"  Font-Size="16pt" Font-Underline="false" NavigateUrl="~/EditAddress.aspx">Edit Address and Phone</asp:HyperLink></li>
<li> <asp:HyperLink ID="HyperLink4" runat="server"  Font-Size="16pt" Font-Underline="false" NavigateUrl="~/Change Password.aspx">Change Password</asp:HyperLink></li>
<li> <asp:HyperLink ID="HyperLink5" runat="server"  Font-Size="16pt" Font-Underline="false" NavigateUrl="~/Change Payment Method.aspx">Change Payment Method</asp:HyperLink></li> 
</ul>
</li>
</ul></td>
</tr>
<tr>
<td class="auto-style30"><asp:Label ID="Label5" runat="server" ForeColor="Highlight" style="text-transform:capitalize;" Font-Size="14pt" Text="Age: " Font-Bold="True"></asp:Label></td>

如果您希望右侧的图像和菜单随窗口大小缩放,请不要为它们指定特定的宽度。您可以设置最小宽度以确保它们不会低于特定宽度,但除此之外,为两个容器提供其父容器的百分比宽度,以便在调整窗口大小时使它们缩放大小。

最新更新