0

一个包含 4 个 div 标签的示例 html，其中第一个有几个 html 控件，第二个和第三个 div 仅用于根据条件显示状态。第四个用于提交按钮。

默认情况下，第一个和第二个可见性是隐藏的。但是，它占用了垂直空间，因此我的提交按钮位置有一些空白空间。我怎样才能减少那个空间？

我的代码：

<!-- Div 1 -->
<div>
<!-- few controls goes here -->
</div>

<!-- Div 2 -->
<div style="visibility:hidden">
<asp:CompareValidator ID="valPwd" validationgroup="valRegGroup" runat="server" ErrorMessage="Passwords don't match" CssClass="validation" ControlToCompare="txtPwd" ControlToValidate="txtConfirmPwd"></asp:CompareValidator>
</div>

<!-- Div 3 -->
<div style="visibility:hidden">
<asp:Label ID="lblStatus" runat="server" Text="" CssClass="validation"></asp:Label>
</div>   

<!-- Div 4 -->
<div style="top:0px;margin-top:0px;">
<asp:Button ID="btnValidate" runat="server" Text="Renew" 
  CssClass="SubmitButton" onclick="btnValidate_Click"  />                     
</div>
4

4 回答 4

3

您可以尝试display: none以div' 不占用布局中任何空间的方式进行设置。

显示您的状态或其他数据时，设置display: block为使其可见。

使用visibility: hidden隐藏元素，但保留其在布局中的空间和位置。

要了解该visibility属性，请参阅：http ://www.w3.org/TR/CSS21/visufx.html#visibility

要了解该display属性，请参阅：http ://www.w3.org/TR/CSS21/visuren.html#display-prop

于 2013-06-26T11:36:16.730 回答
1 
<div style="display:none">

会解决你的问题

display 和 visibility 是不同的样式属性

于 2013-06-26T11:36:28.657 回答
0

尝试display:none安装visibility:hidden

验证者使用display:dynamic属性来减少空间

另一种情况，如果您无法更改并进行修改，请尝试使用以下 css 选择器来减少空间

div[style*="visible"] {  
 display:inline;
    }  

div[style*="hidden"] {  
      display:none;
    }
于 2013-06-26T11:39:19.180 回答
0

你应该使用

样式=“显示：无”>

代替

样式=“可见性：隐藏”

这样就不会为未显示的元素留下任何空间。

于 2013-06-26T12:18:24.780 回答