火狐下不支持position:relative;top:50%;?
来源:互联网 发布:网络直播 yy 编辑:程序博客网 时间:2024/05/01 11:32
要实现垂直居中,见代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE>Measure for Measure</TITLE></HEAD><BODY ><style> body{text-align:center;height:100%;}#wrap{height:100px;width:100px;border:1px solid red;text-align:center;/*关键代码*/position:relative;top:50%;margin-top:-50px;/*水平居中 FF下*/margin-left:auto;margin-right:auto;}</style><BODY><div id="wrap">aaaa</div></BODY></HTML>
这段代码在IE FF下都兼容;
网上很多评论FF不支持position:relative; 这是不对的任何浏览器都支持position:relative;
若上面代码注释掉body{height:100%;};则FF下会出现问题;问题就是
positon:relative;top:50%;
50%相对父元素的高;但是body没有指定高;(IE下应该是默认body{100%;})
所以需要用到百分比时,一定指定其所在容器的大小!
- 火狐下不支持position:relative;top:50%;?
- 关于火狐在<td>中不支持使用position:relative
- 火狐position定位时用到margin-top:50%出错
- css定位position,absolute relative两种情况下,top,left,right,bottom的区别
- Firefox下tr的position:relative失效?
- position:relative
- position:relative
- 水平居中,position:relative;left:-50%;
- 使用position:relative制作下边框下的小三角
- ie6下不支持position:fixed的解决办法
- 关于ie 下css div position:relative;定位失效
- position:relative;top属性移动div后的空白怎么去掉
- position:relative;top属性移动div后的空白怎么去掉?
- position:relative 与position:absolute
- position: absolute、relative
- position absolute,relative 定位
- position属性:absolute&relative
- css中的position:relative
- 随便写写
- 旋转数组
- Nginx应用案例分享:压力测试
- 自定义标签--传统标签--简单标签--JSTL核心标签库
- 尚观第七天学习后总结pgrep与kill的使用
- 火狐下不支持position:relative;top:50%;?
- TraceLog.h - ActiveX DLL (Visual C++) and Visual Basi 免费开源
- Spring-3.1.1的详细说明
- KMP算法
- gif高质量动画输出的技巧?【PS CS3用“将文件载入堆栈”】
- 每天进步一点点之 C++初学学生类
- android button安装监听的三种形式
- 华为boss力荐公司高层看的一篇文章,真的很经典!!![转载]
- 启动和停止Java应用程序的Shell脚本