如何补偿overflow属性? [英] How do I compensate for the overflow property?
问题描述
源自此问题
这第一个图像没有溢出。顶部是我按下按钮之前,底部是之后。
This first image is with no overflow. The top is before I press the button, and the bottom is after.
alt text http://img19.imageshack.us/img19/7594/nooverflow.png
这个图片是用 overflow:auto
。顶部是按下按钮之前,底部是按钮。
And this image is with overflow:auto
. The top is before I press the button, and the bottom is after.
alt text http://img134.imageshack.us/img134/4015/overflow.png
我要找的是面板,看起来像在按下按钮之前的第一个图像,当我按下按钮时,它在第二个图像看起来像什么。
What I'm looking for is the panel to look like it does in the first image before I press the button, and what it looks like in the 2nd image when I do press the button.
以下是相关代码的副本:
Here's a copy of the relevant code:
<asp:Panel ID="pnlCustomer" runat="server" style="background-color:#ccccff; width:500px; height:90%; position:relative;" BorderColor="DarkBlue" BorderWidth="2px">
...
<style>
div.textboxArea {
text-align:center;
float:left;
width:40%;
margin-top:35px;
}
.textboxArea TextBox {
width:80%;
}
.centerMeVertically div {
position:absolute;
top:50%;
vertical-align:middle;
height:30px;
width:100%;
margin-top:0px;
text-align:center;
}
div.centerMeVertically {
float:left;
width:20%;
text-align:center;
height:60px;
position:relative;
}
p {
margin:-35px 0 0 0;
}
.container {
margin-top:10px;
margin-bottom:10px;
overflow:auto;
}
</style>
<div class="container">
<div style="width:100%;">
<div class="textboxArea">
<p><asp:Label runat="server" ID="lblInfoDesc" /></p>
<asp:TextBox ID="txtInfoDescription" runat="server" TextMode="MultiLine" Rows="3" MaxLength="500" />
</div>
<div class="centerMeVertically">
<div><asp:Button ID="btnNextInfo" runat="server" Text="Next" /></div>
</div>
<div class="textboxArea">
<p><asp:Label runat="server" ID="lblInfoData" /></p>
<asp:TextBox ID="txtInfoData" runat="server" TextMode="MultiLine" Rows="3" MaxLength="500" />
</div>
</div>
</div>
推荐答案
如何隐藏textboxArea?现在,textboxArea完全包含在容器中,因此overflow:auto应该包含它。
How are you 'hiding' textboxArea? Right now, textboxArea is fully contained within container, so overflow: auto should contain it. My guess is you are hiding textboxarea via visibility: hidden, which will make it not appear, but it'll still take up space.
而是使用display:none,或者使用display:none,或者使用display: ,通常是首选,通过绝对定位将其从屏幕上定位,直到你需要它。
Instead use display: none, or, often preferred, position it off the screen via absolute positioning until you need it.
这篇关于如何补偿overflow属性?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!