我想让我的图像垂直对齐：中间（我从数据库中动态地获取图像。）

Question

<div class="col-md-3 col-sm-6 col-xs-12 center wow fadeInUp" data-wow-delay="0.2s" style="visibility: hidden; animation-delay: 0.2s; animation-name: none;">
                                <div class="thumb-links" style="width:100%;">
                                    <img src="@item.projectImageURL" alt="@item.projectCompany">
                                </div>                             
                            </div>

和CSS

.thumb-links {
display: block;
position: relative;
z-index: 2;
text-align: center;
cursor: pointer;
height: 270px;}

@media (max-width: 767px) {
.thumb-links {
    max-width: 370px;
    margin-left: auto;
    margin-right: auto;
}}
.thumb-links img {
height: auto;
vertical-align:middle;
-moz-transition: 0.5s all ease;
-webkit-transition: 0.5s all ease;
-o-transition: 0.5s all ease;
transition: 0.5s all ease;}

图像的宽度和高度与其他图像不同我无法正确使用它们。他们将成为拇指链接的顶端。

Answer 1

.thumb-links{
     clear: both;
 }

将此css属性添加到您的拇指链接。

Answer 2

https://stackoverflow.com/a/37772582/5194515我通过此链接解决了这个问题

.thumb-links {
position: relative;
z-index: 2;
text-align: center;
cursor: pointer;
height: 270px;
float:left;
width:270;
display:flex;
align-items:center;
justify-content:center;}