我无法将图像与div对齐 我正在使用bootstrap,试图创建一行并添加列,但图像仍然低于它所在的div的边缘。
.contacts {
height:300px;
background-color: #5E7BA7;
text-align:center;
padding-top:10px;
color:white;
font-size:18px;
}
#ava {
border-radius:100%;
}

<div class="contacts" id="contacts">
<div class="container-fluid">
<div class="row">
<div class="col-xs-8">
<h2>Contact me</h1>
<p>Get in touch with me and we will build something great.</p>
<p>E-mail: s4ek1389@gmail.com</p>
<a href="https://vk.com/s4ekotihin"class="btn btn-social-icon btn-vk"><i class="fa fa-vk"></i></a>
<a href="https://www.facebook.com/profile.php?id=100004760679976" class="btn btn-social-icon btn-facebook">
<i class="fa fa-facebook"></i></a>
</div> <!-- col-xs-8-->
<div class="col-xs-4">
<img src="https://pp.vk.me/c636425/v636425401/55c29/w3KT6I3_x_0.jpg" class="img-responsive center-block" id="ava">
</div>
</div> <!-- .row -->
</div> <!-- .container-fluid -->
</div> <!-- .contacts -->
&#13;
我正在尝试将我的照片与联系人块对齐,因此它是垂直居中的。
我该如何解决这个问题?
答案 0 :(得分:2)
这是你在.contacts上的高度。图像和填充大于400像素高,因此它会溢出触点容器。您可以让联系人的高度扩展到图像的高度,也可以将图像的高度设置为最大高度400.