我有三个这样的面板:
___ _________ ___
| | | | | |
| | | | | |
| | | | | |
| | | | | |
|___| |_________| |___|
但是如果我稍微缩短窗口，中间面板会低于两个侧面板:
___ ___
| | | |
| | | |
| | | |
| | | |
|___| |___|
_________
| |
| |
| |
| |
|_________|
这是我的代码
<style>
.SidePanel {
background-color:#9999CC;
width:100px;
height:597px;
}
</style>
<div style="text-align:center;">
<div style="float:left">
<asp:Panel ID="Panel4" runat="server" CssClass="SidePanel" BorderColor="DarkBlue" BorderWidth="2px"/>
</div>
<div style="float:right">
<asp:Panel ID="Panel5" runat="server" CssClass="SidePanel" BorderColor="DarkBlue" BorderWidth="2px"/>
</div>
<div style="display:inline;">
<asp:Panel ID="Panel0" runat="server" BackColor="#9999CC" BorderColor="DarkBlue" BorderWidth="2px" Width="900">
...content...
</asp:Panel>
</div>
</div>
我如何阻止它这样做？
编辑:这是我根据回复所做的更改。
<style>
.SidePanel {
background-color:#9999CC;
height:597px;
}
</style>
<div style="text-align:center; min-width:1024px; width:100%;">
<div style="float:left; width:10%">
<asp:Panel ID="Panel4" runat="server" CssClass="SidePanel" BorderColor="DarkBlue" BorderWidth="2px"/>
</div>
<div style="float:right; width:10%">
<asp:Panel ID="Panel5" runat="server" CssClass="SidePanel" BorderColor="DarkBlue" BorderWidth="2px"/>
</div>
<div style="width:70%">
<asp:Panel ID="Panel0" runat="server" BackColor="#9999CC" BorderColor="DarkBlue" BorderWidth="2px" style="width:100%;">
最佳答案
这是我所拥有的:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Three Little Panels, All in a Row</title>
<style>
#container
{
min-width:800px;
overflow:auto;
}
.littlePanels
{
float:left;
width:100px;
background-color:#999900;
}
.bigOlePanel
{
float:left;
width:600px;
background-color:#CC9966
}
</style>
</head>
<body>
<div id="container">
<div class="littlePanels"> </div>
<div class="bigOlePanel"> </div>
<div class="littlePanels"> </div>
</div>
</body>
</html>
希望这能奏效!
关于asp.net - 当窗口变小时，如何防止面板被强制置于另外两个面板下方？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2028493/