码迷,mamicode.com
首页 > 其他好文 > 详细

问题记录之-----div中多行文字垂直居中

时间:2017-07-26 14:42:19      阅读:153      评论:0      收藏:0      [点我收藏+]

标签:sla   div   span   osi   width   size   --   transform   abs   

直接上代码,核心是用父div{position:relative},子span{position:absolute;transform: translate3d(0, -50%, 0)}

html代码:

<div class="main_box">
                <span v-if="poisonDay == 1">&nbsp&nbsp&nbsp&nbsp别人身材好训练猛才说不介意多吃,你多吃可不就是胖了吗!说你呢,还不运动去!</br></span>
            </div>

css代码:

.main_box {
                font-size: 26px;
                color: white;
                width: 500px;
                margin: 0 auto;
                height: 180px;
                position: relative;
                span {
                    position: absolute;
                    top: 50%;
                    transform: translate3d(0, -50%, 0);
                }
            }

 

问题记录之-----div中多行文字垂直居中

标签:sla   div   span   osi   width   size   --   transform   abs   

原文地址:http://www.cnblogs.com/yujiekangweb/p/7239321.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!