Question

我面临以下奇怪的情况：我在div中创建了一个按钮，我希望它在中间垂直对齐。现在，当我运行所有脚本时，按钮保持固定在div的顶部，无论我使用什么方法（我已经尝试了几乎所有的东西）。如果我单独运行它（意味着只有相关的脚本行），那么它在中间工作并对齐。下面我是行：

<head>
<style>
.p1 {
position: absolute;
left: 250px;
top: 200px;
width: 400px;

background-color: #DFD7D7;
display: block;
height: 2em;
  line-height: 2em;
}
.p2 {
position: absolute;
left: 250px;
top: 200px;
width: 400px;

background-color: #DFD7D7;
display: none;
height: 2em;
  line-height: 2em;
}
.bt {
position: absolute;
left: 650px;
top: 200px;
width: 100px;
background-color: #DFD7D7;
height: 2em;
  line-height: 2em;
}
</style>

<script language="JavaScript">
function setVisibility(id1,id2) {
if(document.getElementById('bt1').value=='Show Layer'){
document.getElementById('bt1').value = 'Show Layer';
document.getElementById(id1).style.display = 'none';
document.getElementById(id2).style.display = 'block';
}
}
</script>
<title>Untitled</title>
</head>
<body>

</body>
</html>
<%
p_company = Request.form("p_company")
p_email = Request.form("p_email")
p_phone = Request.form("p_phone")
p_type = Request.form("p_type")
p_pword = Request.form("p_pword")
p_pass2 = Request.form("p_pass2")
%>
<%
Session("Language")=Request.querystring("id")
if Session("Language")="ENG" then
%>
<div class="p1" id="sub3">
Company: <%= p_company %>
</div>
<div class="p2" id="sub4">Company:<input type="text"></div>
</div>
<div class="bt">
<input type=button name=type id='bt1' value='Show Layer' onclick="setVisibility('sub3','sub4');";>
</div>
<%
end if
%>`

正如你所看到的，我正在为所有div使用line-height，它工作正常，但没有按钮。但是（奇怪）如果我在另一个页面中分离按钮的代码，那么它也可以正常工作。有什么建议非常感谢你提前。干杯瓦尔特

Answer 1

<div class="bt">
<input type=button name=type id='bt1' value='Show Layer' onclick="setVisibility('sub3','sub4');";>
</div>

你没有为bt1添加任何风格，你需要分配一个保证金。这样子按钮就可以放在容器内了，＃bb＆＃39;

所以添加这个css：

#bt1 {width:40%;
      height:20%;
      margin-top:40%;
      padding:0;}

垂直对齐按钮 - 奇怪的行为

1 个答案: