[英]vertical text center in <div>
所以我正在尝试获得2个div容器,它们都应包含居中文本(x轴和y轴)。
感谢Google和stackoverflow,我偶然发现了几个与vertical-align等相关的解决方法。但似乎没有任何效果。
#right-menu {
position: absolute ;
right: 0% ;
top: 0% ;
height: 100% ;
width: 5% ;
text-align: center ;
background: #ededed ;
display: table-cell;
vertical-align: middle ;
这是一个小提琴:
基本上首先你必须从CSS中将父元素定义为表,然后你可以将它的子元素显示为表格单元格。
例如,
div.parent {
display: table;
}
div.parent div.child {
display: table-cell;
vertical-align: middle;
}
看看这个链接,它会澄清你的疑问.. http://css-tricks.com/vertically-center-multi-lined-text/
Vertical-align:middle
属性不与position:absolute;
如果你使用vertical-align:middle然后尝试这个布局修改后的布局http://jsfiddle.net/7Rgvs/5/
使用display:table作为(holder#left-menu element)并显示:table-cell作为内部holder元素并使用以下样式:
#left-menu .inner {
display: table-cell;
margin: 0 auto;
text-align: center;
vertical-align: middle;
width: 100%;
}
我编辑了小提琴内的左侧菜单: http : //jsfiddle.net/7Rgvs/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.