[英]align image in a div vertically center
CODE: 码:
.company-logo-wrap{
display: block;
background: #fff;
margin-left: -15px;
padding: 10px;
border: 1px solid #a5a5a5;
text-align: center;
height: 400px;
}
You can use vertical-align: middle
property, which will work only with display: table-cell/table
您可以使用vertical-align: middle
属性,该属性仅适用于display: table-cell/table
.company-logo-wrap{
display: table-cell;
background: #fff;
margin-left: -15px;
padding: 10px;
border: 1px solid #a5a5a5;
text-align: center;
height: 400px;
vertical-align: middle;
}
Use following Css 使用以下CSS
.company-logo-wrap{
display: table;
background: #fff;
margin-left: -15px;
padding: 10px;
border: 1px solid #a5a5a5;
text-align: center;
height: 400px;
width:100%
}
.company-logo-inner {
display: table-cell;
vertical-align: middle;
}
HTML HTML
<div class="main">
<div class="box"></div>
</div>
CSS CSS
.main{ height:500px; border:1px red solid;position:relative}
.box{width:40px; height:40px; background:red; }
/* for centering */
.box{ display: inline-block; }
.main{ text-align: center; }
.main:after{ content: ""; display: inline-block; height: 100%; vertical-align: middle; }
Check this http://jsfiddle.net/SxxWV/11/ 检查此http://jsfiddle.net/SxxWV/11/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.