css 在未知高度的容器内让内容垂直居中

这就是未知高度的垂直居中问题。在ie6下我没办法让 t(图中灰色块)有100%的高度。于是基于vertical-align:middle的垂直居中方法就不管用了。

这个写法用到了IeOnly的:writing-mode:tb-rl;这个属性,以及IE6下top:50%能正确定位到当前父容器高度的一半位置(padding-top:50%、margin-top:50%貌似不能得到这里想要的效果)

可以看到 t 被设置了高度,这个高度应该是介于 t 中文字竖排时候的高度和 A 最小高度之间的。

这中写法适合于不单独定义高度的情况,单独定义高度的话,写法就很多很多了……

<styletype="text/css">

style>
<body>
<divclass="container">
<divclass="list">
<h4><spanclass="list_title_add"><span>标题span>span>h4>
<dl>
<dt><ahref="#"title=""target="_blank">饮食男女a><span>(今日新贴:578941)span>dt>
<ddclass="clearall">
<ul>
<li><ahref="#"title=""target="_blank">旅游先遣队a>li>
ul>
dd>
dl>
<dl>
<dt><ahref="#"title=""target="_blank">饮食男女a><span>(今日新贴:578941)span>dt>
<ddclass="clearall">
<ul>
<li><ahref="#"title=""target="_blank">旅游先遣队a>li>
<li><ahref="#"title=""target="_blank">结伴同行a>li>
<li><ahref="#"title=""target="_blank">游玩杭州a>li>
ul>
dd>
dl>
<dl> 欢迎转载但请注明出处 Email:[email protected] , Seven的部落格 http://hi.baidu.com/see7di/home
<dt><ahref="#"title=""target="_blank">饮食男女a><span>(今日新贴:578941)span>dt>
<ddclass="clearall">
<ul>
<li><ahref="#"title=""target="_blank">旅游先遣队a>li>
<li><ahref="#"title=""target="_blank">结伴同行a>li>
ul>
dd>
dl>
<dl>
<dt><ahref="#"title=""target="_blank">饮食男女a><span>(今日新贴:578941)span>dt> dl>
<dl>
<dt><ahref="#"title=""target="_blank">饮食男女a><span>(今日新贴:578941)span>dt>
<ddclass="clearall">
<ul>
<li><ahref="#"title=""target="_blank">旅游先遣队a>li> ul> dd> dl> <dl>
<dt><ahref="#"title=""target="_blank">饮食男女a><span>(今日新贴:578941)span>dt>
<ddclass="clearall">
<ul> 欢迎转载但请注明出处 Email:[email protected] , Seven的部落格 http://hi.baidu.com/see7di/home
<li><ahref="#"title=""target="_blank">旅游先遣队a>li>
ul>
dd>
dl>
div>
div>
body>
html>

转载于:https://www.cnblogs.com/see7di/archive/2011/06/30/2239693.html

你可能感兴趣的:(css 在未知高度的容器内让内容垂直居中)