position:fixed定位时 “高度坍塌” 问题的解决
问题:对于固定定位的元素,固定住高度,后面紧跟的模块会当做前面的固定元素不存在似的,这给布局带来了困扰
解决方法:
1.给第二个模块div设置margin-top的值,margin-top的值设为大于等于固定定位模块的高度
2.这个方法是百度百科手机页面用的,先为固定定位元素设一个父元素,不设高度,不设宽度,什么都不设,他的第一个子元素是我们需要做固定定位的元素,这个按照需求写好样式,此时,父元素的高度依然是0,如何使得父元素有高度呢,父元素有了高度,后面来的模块就不用设置margin-top的值了,我们只要在固定定位元素后面写一个同等高度的空div便解决了,这时父元素就有高度了,而且正是我们需要的高度,这个空的div像一根柱子,支撑起了这个空中楼阁。
position:fixed定位时 “高度坍塌” 问题的解决的更多相关文章
- 唤醒键盘时取消对特定类的position:fixed定位
/* 唤起键盘时取消对特定类的position:fixed定位 */ var windheight = $(window).height(); /*未唤起键盘时当前窗口高度*/ $(window).r ...
- 关于苹果手机微信端 position: fixed定位top导航栏问题
在移动端,position: fixed定位一般不被识别,或者在ios系统中,获取input焦点时,会导致position: fixed的top失效,下面是我验证过的方法,大家可以试试.<!do ...
- IE11下使用fixed定位时鼠标滚动不平滑
很久不用IE了,近期做兼容性测试发现一个fixed定位的问题,当元素使用fixed定位时,其应该不随页面滚动,在chrome/firefox/edge下都很完美,元素完全不动,但是使用IE11时,如果 ...
- ie7中position:fixed定位后导致margin:0 auto;无效
布局网页时,需要把header固定在上方.直接使用position:fixed;现代浏览器以及ie8以上均正常显示,但是ie7中,header里面的子元素设置的水平居中并没有效果.做了各种尝试,都没有 ...
- iOS后台定位时授权提示一闪而过的解决办法
今天做后台定位时,授权提示"允许 XXX 在您并未使用该应用时范文您的位置吗?"总是一闪而过,点不到,或者压根就不弹出.后来找到了解决问题的方法,那就是:将CLLocationMa ...
- ios设备触发虚拟键盘输入后position:fixed 无效的一些简单另类的解决方法。
首先看一下我要解决的问题,第一张图是正常的情况下,第二张图是点击了输入框之后的情况,就是要解决此问题~! 百度了一下解决方法,好像有以下的一些方法: 1. iscroll 2. Jquery Mobi ...
- 关于canvas画布使用fillRect()时高度出现双倍效果解决办法
当设置canvas的宽度和高度时,只有内嵌css有效,外部css会出现拉伸的情况,例如: <!DOCTYPE html> <html lang="en"> ...
- CSS高度坍塌原因及解决办法
在文档流中,父元素的高度默认是被子元素撑开的,也就是子元素多高,父元素就多高. 但是当为子元素设置浮动以后,子元素会完全脱离文档流,此时将会导致子元素无法撑起父元素的高度,导致父元素的高度塌陷.由于父 ...
- 父节点使用css的transform: translate(0, 0)时position:fixed在chrome浏览器中无效
今天在做移动端的页面,无意间发现了一个Chrome浏览器下的一个bug,在使用CSS3的transform: translate(0, 0)属性对节点A进行位置转化,此时A节点下面有一个字节点B,节点 ...
随机推荐
- js中的apply call 操作小结(参考自网络)
1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象 说明: call ...
- javascript 关于闭包的知识点
javascript 关于闭包的认识 概念:闭包(closure)是函数对象与变量作用域链在某种形式上的关联,是一种对变量的获取机制. 所以要大致搞清三个东西:函数对象(function object ...
- cookie,localStorage,sessionStorage
1.cookie 由于HTTP是一种无状态的协议,服务器单从请求内容上无法判断客户身份.因此,cookie弥补这个缺陷,每次请求都携带cookie,这样服务器就能能知道不同的客户端请求了. 对于同一域 ...
- jquery上传控件个人使用
转了一篇jquery的上传控件使用博文,但是,经过测试貌似不行,自己研究了一下,效果实现.记下,以后使用. 下载“Uploadify”,官方版本为php的,很多文件不需要,删除带.php的文件. &l ...
- Web 前端开发者必知CSS 属性
1. 圆角效果 如今的Web设计在不断跟进最新的开发技术,纷纷采用HTML5来开发多样性的Web应用.HTML5的优势之一,就是之前必须用图片实现的元素,现在可以用代码来实现. “border-ra ...
- ActiveRecord 模式杂谈
ActiveRecord也属于ORM(对象关系映射)层,由Rails最早提出,遵循标准的ORM模型:表映射到记录,记录映射到对象,字段映射到对象属性.配合遵循的命名和配置惯例,能够很大程度的快速实现模 ...
- D3js初探及数据可视化案例设计实战
摘要:本文以本人目前所做项目为基础,从设计的角度探讨数据可视化的设计的方法.过程和结果,起抛砖引玉之效.在技术方案上,我们采用通用web架构和d3js作为主要技术手段:考虑到项目需求,这里所做的可视化 ...
- 使用hexo创建github博客
前言 前面说过,之前用wordpress辛辛苦苦搭建的博客,因为服务器和域名的问题挂掉了.后来发现github也能够搭建自己的博客,不需要去关心主机域名的问题,而且还能使用Markdown来写博客,就 ...
- 转 Android - 文件操作
一.资源文件的读取: 1) 从resource的raw中读取文件数据: String res = ""; try{ //得到资源中的Raw数据流 InputStream in = ...
- Acdream a + b
http://acdream.info/problem?pid=1007 两个 long long 相乘会超long long #include <cstdio> #include < ...