近日，微博上有朋友比较纠结未知高度的文本垂直居中问题。这个和「未知高度图片垂直居中」有些类似，但是有一些细节需要注意。
这里有之前写的一个未知宽高对话框的垂直居中（拖动改变大小看是不是依然居中？），只不过对话框是相对于 viewport（视口）居中的，这里的文字需要的是相对于容器垂直居中。
拿到这样的需求时，先不要想着如何兼容 IE6/7。先想想文字垂直居中靠什么属性？vertical...
分类：
其他好文 时间：
2014-09-22 16:11:22
阅读次数：
210
1. [代码][CSS]代码 1, FF下给 div 设置 padding 后会导致 width 和 height 增加, 但IE不会.(可用!important解决)2, 居中问题.1).垂直居中.将 line-height 设置为 当前 div 相同的高度, 再通过 vetical-align....
分类：
Web程序 时间：
2014-09-19 17:14:35
阅读次数：
390
参考：http://css-tricks.com/centering-in-the-unknown/ 我在中间 我在底部
分类：
Web程序 时间：
2014-09-18 18:36:24
阅读次数：
185
1.上面两个div在使用纯CSS的情况下，保持在任何尺寸的页面中都横向居中，垂直居中（页面大小不固定）。横向居中，垂直居中2.如何实现一个层在浏览器中垂直左右居中？让DIV水平和垂直居中，必需知道该DIV得宽度和高度，然后设置位置为绝对位置，距离页面窗口左边框和上边框的距离设置为50%。其实解决的思...
分类：
Web程序 时间：
2014-09-18 18:28:04
阅读次数：
236
纯CSS实现：盒子内元素垂直居中，宽高固定与否均可，IE5除外所有浏览器均兼容： 1 2 3 4 5 纯CSS实现：盒子内元素垂直居中，宽高固定与否均可，IE5除外所有浏览器均兼容 6 12 13 14 15 16 17 text-align:center;1...
分类：
Web程序 时间：
2014-09-18 14:39:23
阅读次数：
196
一同事应聘TX，出了一道题，分别用1,2,3,5个标签实现红十字会图标，图标水平、垂直居中，短边50px，长边150px。如图： 其中用2,3,5个标签实现不难，略过。一个标签的我比较有兴趣，午休时间想了下，睡醒后就动手实现，代码如下： 1 div{ 2 ...
分类：
Web程序 时间：
2014-09-16 15:36:00
阅读次数：
155
1. 水平居中如果是inline元素：在父元素上面设置text-align:center;如果是block元素：设置宽度和margin:0 auto;如果是多块级元素：在父元素上面设置text-align:center;所有的子元素上面设置display:inline-block;2.垂直居中相对于...
分类：
Web程序 时间：
2014-09-16 15:35:40
阅读次数：
186
原始 demohtml 我是单行测试文字 我是多行文字我是多行文字是多行文字我是多行文字我是多行文字我是多行文字我是多行文字我是多行文字我是多行文字我是多行文字我是>多行文字我是多行文字 css .box{ border:1px ...
分类：
Web程序 时间：
2014-09-15 12:44:38
阅读次数：
286
1：单行文字垂直居中： 如果一个容器中只有一行文字的话，定义height(高度)和 line-height(行高)相等即可。 如：aa2：多行文本固定高度垂直居中：核心：display:table 和display:table-cell ;vertical-align:middle;兼容：ie7+....
分类：
Web程序 时间：
2014-09-12 21:55:34
阅读次数：
250
css：.box-wrap{display:table;width:200px;height:200px;*position:relative;}/*最外边的容器，需固定宽高*/.box-hack{display:table-cell;height:200px;vertical-align:midd...
分类：
Web程序 时间：
2014-09-12 20:29:33
阅读次数：
200
