postion:fixed和margin:0 auto的使用
很多同学将顶部菜单固定,使用postion:fixed,然后使用margin:0 auto进行居中,发现margin:0 auto并不起作用。
通常,我们要让某元素居中,会这样做:
#element{
margin:0 auto;
}
如果还想让此元素位置固定呢?一般我们会添加position:fixed,如下:
#element{
position:fixed;
margin:0 auto;
}
但是这样做的结果就是,元素不居中了。这说明fixed使对象脱离了正常文档流。
解决方案:
#element{
position:fixed;
margin:0 auto;
left:0;
right:0;
}
但是在IE7以下的版本中无法工作,要将其更改为:
#element{
position:fixed;
margin:0 auto;
left:auto;
right:auto;
}
最后我们可以这样:
if ($.browser.msie && parseInt($.browser.version, 10) <= 7) {
strAlertWrapper.css({position:'fixed', bottom:'0', height:'auto', left:'auto', right:'auto'});
}
postion:fixed和margin:0 auto的使用的更多相关文章
- overflow:hidden与margin:0 auto之间的冲突
相对于父容器水平居中的代码margin:0 auto与overflow:hidden之间存在冲突.当这两个属性同时应用在一个DIV上时,在chrome浏览器中将无法居中.至于为啥我也不明白.
- margin:0 auto;不居中
margin:0 auto:不居中可能有以下两个的原因; 1.没有设置宽度<div style="margin:0 auto;"></div>看看上面的代码 ...
- margin:0 auto 与 text-align:center
1.text-align:通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式; text-align:center 设置文本或img标签等一些内联对象的居中. 2.m ...
- margin:0 auto 与 text-align:center 的区别
基本概念: 1.text-align: 属性规定元素中的文本的水平对齐方式; 该属性通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式; 一般情况下设置文本对齐方式的时使用此属性.支 ...
- IE下margin:0 auto为什么不居中?
http://blog.sina.com.cn/s/blog_68c6be330101k7kn.html 我们经常用DIV+CSS布局网页的时候,正常情况下需要将div居中显示时,使用Css样式:ma ...
- margin:0 auto在IE中失效的解决方案
转自:http://www.cnblogs.com/hongchenok/archive/2012/11/29/2795041.html 最近在开发项目的时候,发现在火狐浏览器中设置外容器margin ...
- html页面docutype前面出现字符会导致IE678 margin:0 auto;失效
html页面<!DOCTYPE html>前面出现字符会导致IE678 margin:0 auto;失效
- CSS样式margin:0 auto不居中
<style type="text/css">html,body{height:100%;width:960px;}.container{background-colo ...
- css中margin:0 auto没作用
很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在CSS中加了margin:0 auto;却没有效果,不能居中的问题!margin:0 auto;的意思就是:上下边界为0,左右根据宽度自适应!其 ...
随机推荐
- jmeter的线程数,并发用户数,TPS,RPS 关系解说
背景 在做性能测试的时候,传统方式都是用并发虚拟用户数来衡量系统的性能(站在客户端视角),一般适用于一些网页站点例如首页.H5的压测:而RPS(Requests per second)模式主要是为了方 ...
- 网络编程中 TCP 半开连接和TIME_WAIT 学习
https://blog.csdn.net/chrisnotfound/article/details/80112736 上面的链接就是说明来 SO_KEEPALIVE 选项 为什么还需要 在应用层开 ...
- 手把手教你定位常见Java性能问题
概述 性能优化一向是后端服务优化的重点,但是线上性能故障问题不是经常出现,或者受限于业务产品,根本就没办法出现性能问题,包括笔者自己遇到的性能问题也不多,所以为了提前储备知识,当出现问题的时候不会手忙 ...
- Java Object类 和 String类 常见问答 6k字+总结
写在最前面 这个项目是从20年末就立好的 flag,经过几年的学习,回过头再去看很多知识点又有新的理解.所以趁着找实习的准备,结合以前的学习储备,创建一个主要针对应届生和初学者的 Java 开源知识项 ...
- 「一本通 1.3 例 4」Addition Chains
Addition Chains 题面 对于一个数列 \(a_1,a_2 \dots a_{m-1},a_m\) 且 \(a_1<a_2 \dots a_{m-1}<a_m\). 数列中的一 ...
- LOJ10201
题目描述 原题来自:Codeforces Round #400 B. Sherlock 有了一个新女友(这太不像他了!).情人节到了,他想送给女友一些珠宝当做礼物. 他买了n 件珠宝.第i 件的价 ...
- docker镜像加速,docker更换为国内镜像
docker镜像加速,docker更换为国内镜像 一.使用官方镜像 二.Docker守护进程配置加速器 相关博文原文地址: CSDN:让我思考一下 :docker更换为国内镜像 一.使用官方镜像 Do ...
- 记一次,Docker镜像1G多精简至300+M的过程
记一次,Docker镜像1G多精简至300+M的过程 一.业务场景描述 二.Docker时区不一致,相差8小时 三.通过Docker发布的服务上传文件上传不上去 四.上传的图片带水印,水印中包含的字体 ...
- Spark练习之Transformation操作开发
Spark练习之Transformation操作开发 一.map:将集合中的每个元素乘以2 1.1 Java 1.2 Scala 二.filter:过滤出集合中的偶数 2.1 Java 2.2 Sca ...
- 31-1.解决service iptables save出错
CentOS 7.x开始,CentOS开始使用systemd服务来代替daemon,原来管理系统启动和管理系统服务的相关命令全部由systemctl命令来代替.service命令只保留下了极少部分使用 ...