垂直对齐div中的文本[复制]

大兔子大兔子 提交于 2020-08-07 08:35:07

问题:

This question already has an answer here: 这个问题在这里已有答案:

The code below (also available as a demo on JS Fiddle ) does not position the text in the middle, as I ideally would like it to. 下面的代码(也可以作为JS Fiddle的演示版 )不会将文本放在中间,正如我理想的那样。 I cannot find any way to vertically centre text in a div , even using the margin-top attribute. 即使使用margin-top属性,我找不到任何方法在div垂直居中文本。 How can I do this? 我怎样才能做到这一点?

<div id="column-content">
    <img src="http://i.stack.imgur.com/12qzO.png">
    <strong>1234</strong>
    yet another text content that should be centered vertically
</div>
#column-content {
    display: inline-block;
    border: 1px solid red;
    position:relative;
}

#column-content strong {
    color: #592102;
    font-size: 18px;
}

img {
    margin-top:-7px;
    vertical-align: middle;        
}

解决方案:

参考一: https://stackoom.com/question/coBD/垂直对齐div中的文本-复制
参考二: https://oldbug.net/q/coBD/Vertically-align-text-within-a-div-duplicate
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!