html:
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div class="container">
<div class="item">
<button>Hide One</button>
<input type="text" value="One" />
</div>
<div class="item">
<button>Hide Two</button>
<input type="text" value="Two" />
</div>
<div class="item">
<button>Hide Three</button>
<input type="text" value="Three" />
</div>
</body>
</html>
css:
.container{
display: table;
}
.item{
display: table-cell;
border: 1px green solid;
width: 460px;
height: 200px;
vertical-align: middle;
text-align: center;
}
最后运行效果: