转: Firefox 浏览器对 TABLE 中绝对定位元素包含块的判定有错误

标准参考元素的包含块 W3C CSS2.1 规范中规定,绝对定位元素的包含块(containing block),由离它最近的 position 特性值是 "absolute"."fixed"."relative" 之一的祖先元素组成:如果这个祖先元素不存在,则包含块由根元素组成. 绝对定位元素的定位绝对定位元素的定位,依赖于其包含块.也就是说,当绝对定位元素的 "top"."left" 值被设置之后,…

table中绝对定位元素相对td定位失效解决方案

开门见山! 问题:在一个table中,我需要在td里面绝对定位一个div, 写法:td{position:relative;} div{position:absolute;} OK,就这么简单,思路也没什么问题,并且在chrome中结果完美. BUT!!! IE(此处只测了一下IE,或许别的浏览器也不行,自行测试),坑比的IE来了, 失效了,定位失败,没有预期的效果. 那么在我的项目中用到的解决方案是: 不怕麻烦的在这个absolute定位的div外层包裹一个relative定位的div,如果想…

仅Firefox中A元素包含Select时点击Select不能选择option

这是在使用京东的一个日期组件时碰到的bug,重现bug的代码精简如下 <!DOCTYPE HTML> <html> <head> <title> 仅Firefox中A元素包含Select时点击Select不能选择option </title> </head> <body> <a href="javascript:void 0"><select> <option>1&l…

IE7中绝对定位元素之间的遮盖问题

由于页面复杂就不上现实例子,举例说明. 两个同层级<div>元素,都设置了 position: relative;相对定位. 他们的内部的元素(不管什么元素了)都设置了position: absolute; 而第一个<div>元素中的元素需要划过显示效果,要遮挡下方的<div>,可在这个时候,恰恰相反,居然被后者遮盖了(下方的<div>很不服气,有木有). 这里我需要截图演示: 这里有两个部落:一个红色框里面套着一个黄色板块这里我们叫它小A 一个蓝色框里面…

jq一行一行循环读取table中的元素

获取当前tr行号,可依据index 获取当前tr对象获取某一tr下td的内容…

javascript中的元素包含判断

在实际开发中,很多时候需要知道某个节点是不是另一个节点的后代.很多浏览器提供了contains方法,如: console.log(document.documentElement.contains(document.body));//输入ture DOM3提供的compareDocumentPosition方法也可以判断元素位置关系,结果如下: 1 无关 2 居前 4 居后 8 包含 16 被包含因此跨浏览器的contains写法如下: function contains(refNode,ot…

css中margin重叠和一些相关概念（包含块containing block、块级格式化上下文BFC、不可替换元素 non-replaced element、匿名盒Anonymous boxes ）

平时在工作中,总是有一些元素之间的边距与设定的边距好像不一致的情况,一直没明白为什么,最近仔细研究了一下,发现里面有学问:垂直元素之间的margin有有互相重叠的情况:新建一个BFC后,会阻止元素与外界元素的重叠现象. 先了解几个概念:可替换元素.不可替换元素(non-replaced element).包含块(containing block).块级格式化上下文(BFC). 可参考css2.1 中文规范 1.可替换元素与不可替换元素根据css1 中所述:所谓可替换元素就是浏览器根据元素的标签…

CSS中包含块原理解析

CSS包含块原理解析确定CSS中的包含块也确定就是元素的父元素.关键是:看元素是如何定位的.确定包含块很重要,比如设置百分比.另外也可以进行样式的继承等等. 分两个情况: 相对定位和静态定位静态定位(默认)和相对定位的父元素都是最近的父元素. 绝对定位和固定定位绝对定位和固定定位会脱离文档流,他们的包含块是距离它最近的定位祖先. 注意事项浮动元素包含块就是最近的父元素,没有特殊意义.…

table中bordercolor属性设置后最新ie浏览器或firefox中不显示边线，借助table的css来实现边线

table中的bordercolor属性设置后在最新的ie或者firefox中均不显示边线,table的边线又是常用功能.只能使用css来实现了,更通用,更方便一些. css: .ctable{ border-top:1px solid #eaeaea;border-left:1px solid #eaeaea;}.ctable td{ border-right:1px solid #eaeaea;border-bottom:1px solid #eaeaea;} table中:class="…

逆天的IE7中，绝对定位元素之间的遮盖问题

个人比较支持IE9以上的版本,认为他们的样式和效果都是比较人性化的,不过很多时候还是不得不考虑其他版本浏览器的感受,这里IE6就不用考虑他了,这货简直就是IT史上的奇葩,这里要说一个IE7的绝对定位和相对定位后,出现元素遮挡的问题. 问题在这里: 由于页面复杂就不上现实例子,举例说明. 两个同层级<div>元素,都设置了 position: relative;相对定位. 他们的内部的元素(不管什么元素了)都设置了position: absolute; 而第一个<div>元素中的元素…

修改表单元素中placeholder属性样式、清除IE浏览器中input元素的清除图标和眼睛图标

一.修改input元素placeholder属性样式在做项目的时候,一般表单元素的placeholder属性样式都是使用浏览器默认的,但有时候为了追求设计上的美感需要修表单元素的placeholder样式(也有可能是遇到了一个处女座的设计师或者是客户),就不等不修改一下placeholder的样式.可以通过下面的代码修改样式: /*Chrome.Safari等 webkit内核浏览器*/ ::-webkit-input-placeholder{ color:red; } /*Firefox*/…

JavaScript在IE浏览器和Firefox浏览器中的差异总结

JavaScript在IE浏览器和Firefox浏览器中存在一些差异,以下对这些差异部分进行了总结,以及解决方案: 1.HTML对象的 id 作为对象名的问题 IE:HTML 对象的 ID 可以作为 document 的下属对象变量名直接使用 Firefox:不支持解决方法:使用document.getElementById替代document.all 2.如果控件只有name,没有id, 用getElementById时: IE:可以找到对象 Firefox:返回NULL 解决方法:所有控件…

firefox浏览器中使用vux的x-input报错TypeError: _this3.$refs.input.scrollIntoViewIfNeeded is not a function

最近做公众号项目,想着统一风格,所以决定使用vux. 在调试时发现,只要鼠标点击x-input输入框,就会报错 TypeError: _this3.$refs.input.scrollIntoViewIfNeeded is not a function 什么鬼,作为前端小白的我一脸懵逼,这么快就遇到vux框架的坑了吗? 根据错误提示,在node_modules中查找vux的x-input实现方式, 在node_modules => vux => src => x-input找到如下目录内…

firefox浏览器中silverlight无法输入问题

firefox浏览器中silverlight无法输入问题今天用firefox浏览silverlight网页,想在文本框中输入内容,却没想到silverlight插件意外崩溃了.google一下,发现这是firefox的设置问题,解决方法如下: 1.在Firefox浏览器地址栏输入 about:config 2.点击“我保证会小心” 3.查找项目dom.ipc.plugins.enabled.npccbnetsigncom.dll,把它由 false 改成 true 4.关闭Firefox浏览器…

selenium在Eclipse中打开fireFox浏览器是报报错connect to host 127.0.0.1 on port 7055

1.相信很多同学刚接触selenium时,在Eclipse中打开fireFox浏览器是报报错: org.openqa.selenium.firefox.NotConnectedException: Unable to connect to host 127.0.0.1 on port 7055 after 45000 ms. Firefox console output: ...(异常代码太多此处省略) 在网上找了好多方法都是不能解决问题,结果是焦头烂额! 2.其实这是selenium的jar包…

firefox浏览器中 bootstrap 静态弹出框中select下拉框不能弹出（解决方案）

问题出现场景1: 在firefox浏览器中在bootstrap弹出的modal静态框中再次弹出一个静态框时 select下拉框不能弹出选项解决方案:去掉最外层静态框的 tabindex="-1" role="dialog"属性问题出现场景2:在火狐中使用模态框加载日期控件时选择时间下拉菜单没有效果(不能点击),而在谷歌中却是好的, 主要原因是模态框与时间下拉菜单层级关系造成(z-index),因时间控件是收bootstrap的时间控件.js文件生成,所以导致在页…

怎么在Chrome和Firefox浏览器中清除HSTS设置？

HSTS代表的是HTTPS严格传输安全协议,它是一个网络安全政策机制,能够强迫浏览器只通过安全的HTTPS连接(永远不能通过HTTP)与网站交互.这能够帮助防止协议降级攻击和cookie劫持. HSTS最初是为了响应Moxie Marlinspike在2009 BlackHat Federal(2009年黑帽安全大会)上进行的题为"实践中击败SSL的新技巧"的演讲中所提出的一个漏洞而创建的.HSTS所防御的特定漏洞就是利用的是Marlinspike发布的一款叫做SSLStrip的工具.…

js遍历table中的每一个元素

function GetInfoFromTable(tableid) { var tableInfo = ""; var tableObj = document.getElementById(tableid); for (var i = 0; i < tableObj.rows.length; i++) { //遍历Table的所有Row for (var j = 0; j < tableObj.rows[i].cells.length; j++) { //遍历Row中的每…

在浏览器中使用jquery取得iframe中页面中指定元素的值的不同

自己使用aspx页面中嵌套了ascx的页面其中使用了iframe的一些内容,出现了同一个页面的两种取值的方式 1. 在iframe的包含页面,需要使用iframe的页面中的元素,是需要使用$(window.frames["yourframename"].document).find("#yourelementid")的形式,这个是在调试页面的时候在ie和chrome的开发者工具试过的. 2. 在ascx页面写的时候,和ascx的包含页面(iframe包含的是ascx…

爬虫工具fiddle在firefox浏览器中的使用

1.fiddle工作原理浏览器与服务器之间通过建立TCP连接以HTTP协议进行通信,默认通过自己发送HTTP(或HTTPS)请求到服务器. 使用Fiddler之后,浏览器像目标服务器发送的请求都会经过Fiddler代理,所以fiddler可以捕获到http(s)请求,从而可以解释.分析.甚至重写发出去的http(s)请求. 它使用代理地址:127.0.0.1, 端口:8888. 当Fiddler开启会自动设置代理, 退出的时候它会自动注销代理,这样就不会影响别的程序. 不过如果Fiddler非…

linux中Firefox浏览器手动安装 flash

打开firefox浏览器,当你打开有关音频或者视频的网站时候,会提示你安装 flash,可是,官网提示,需要手动安装. 1.先从提示的官网上下载好文件 “install_flash_player_11_linux.i386.tar.gz” 随后直接解压出来.注意:libflashplayer.so 文件现在在终端输入命令把 libflashplayer.so 文件复制到目录为:/usr/lib/mozilla/plugins 现在开始输入命令: 出现这个问题是用户权限不够,所以,我…

js中，浏览器中不同元素位置属性解析

offset() 只对可见元素有效,获取匹配元素在当前视口的相对偏移,返回的对象有两个整型属性,top和left,像素计算: position() 相对父元素的偏移,position.left position.top scrollTop() 相对滚动条顶部的偏移,(可见.隐藏元素都有效) scrollLeft() 相对滚动条左侧的偏移 e.pageX() 相对于文档 clientX 相对于浏览器 offsetX 相对于父元素 screenX 相对于屏幕…

html中表格元素的相关总结

表格元素相关总结: 1.在CSS中,内部表元素(如td.tr.col等)生成矩形框,这些矩形框包含内容.内边距和边框,但没有外边距,因此如果定义外边距,浏览器将忽略该定义:对于table元素,外边距有效,而对于内边距,当border-collapse为separate时有效,当border-collapse为collapse时无效,内边距的定义会被忽略 2.表显示的层级关系为:表 - 列组 - 列 - 行组 - 行 - 单元格,但对于边框并非层级重叠,而是边框合并 3.表的布局分为固定布局(ta…

table中的td自动换行

总有那么几个时候会觉得,table的td不能自适应换行真坑,凭什么只能用tr来换行,经常数据都是连在一起的呀,你叫我怎么把它拆分放到tr里...... 那能不能用ul和li来替换?可以是可以,不过有时遇到“牛逼”的领导你能怎么办,就要用table怎么办!就问你怎么办!!! 那就把tr当ul,td当li用咯! 1.效果图: 2.这是重置样式normalize.css代码: /** * Correct `block` display not defined in IE 8/9. * * 修正IE 8…

FireFox浏览器的about:config参数大全及其具体用途介绍

FireFox浏览器的about:config参数大全及其具体用途介绍,注意:这还远不是所有的about:config参数,由于设置参数太多,官方也只提供英文版本的说明,这里提供的FireFox about:config配置参数并不完整,希望大家一起完善. Quote: ¤什么是about:config¤ about: config是Firefox的设置页面,about:config为Firefox提供了不少高级设置选项在这里以便让你可以更加详细地控制 Firefox的运行方式.官方不推荐用户手…