Html 需要在div内垂直居中显示图像，但此处找到的答案不是'；行不通

我已经做到了：

#parent {
display:table-cell;
vertical-align:middle;
}

还有这个

img {
vertical-align: middle;
}

#parent {
height:200px;
line-height: 200px;
}

这是父div的css

#parent{
display: table-cell; 
vertical-align: middle;
position:relative;
float:left;
margin: 5px 5px 5px 5px;
width:200px;
height:200px;
background-color:#e0ffff;
border-style:solid;border-width:5px;
}

---

我不知道图像的尺寸是多少。我只知道它们不会大于200X200。父级的div容器没有样式。有什么我不知道的地方我做错了吗？我意识到这个问题被问了很多。

可能是您必须从

DIV

中删除

float

---

选中此项

是否有用于#parent的父容器？如果是，则需要以下css：

#parentOf #parent{ display: table; }

如果没有，请在图像周围放置另一个名为content的div，然后尝试：

#content{
    postition: absolute;
    top: 50%;
}

---

在内部div包含图像的位置尝试此操作

标记：

<div class="outer">
  <div class="inner">
    <img src="url" />
  </div>
</div>

.outer{position:relative;}
.inner{
position:absolute;top:50%;
}

$(document).ready(function(){
var inner = $('.inner'),
    ht = inner.height();

inner.css({'margin':-ht/2+'px 0 0 0'});
});

js：

<div class="outer">
  <div class="inner">
    <img src="url" />
  </div>
</div>

.outer{position:relative;}
.inner{
position:absolute;top:50%;
}

$(document).ready(function(){
var inner = $('.inner'),
    ht = inner.height();

inner.css({'margin':-ht/2+'px 0 0 0'});
});

---

好吧我所做的是在图像周围添加另一个div，并给出

display:table cell；垂直对齐：中间对齐

并给了上一位家长

显示：table

谢谢！