IE7浏览器中li底部多出4px Bug怎么办

效果如下

我们在页面布局时,很多时候都要使用ul、li元素,但有些布局方式在低版本的ie上却会出现bug,如4px的错位,如图:

为什么会出现这种bug,其实是由于li内放了块级元素,并且这些块级元素浮动引起的。

对于这种情况,解决的方法有很多,如设置负的margin、用其他标签代替li等,但这要么需要使用hack或者是条件注释,要么就破坏了结构及语义。

现在,这里有一种简单的解决办法,那就是,在浮动的子元素上加一个vertical-align属性,取值可以为top、middle、bottom,三者均可,这样4px的bug就可以解决了。

小编提醒你

这个bug其实是自己操作出来的,bug 不过觉得完全可以不用浮动吗 用inline-block,img,p都inline-block之后再加上vertical-align:middle基本就可以解决了

时间: 2024-11-10 00:40:25

IE7浏览器中li底部多出4px Bug怎么办的相关文章

IE7浏览器窗口大小改变事件执行多次bug及IE6/IE7/IE8下resize问题_jquery

本文主要通过代码示例给大家介绍IE7浏览器窗口大小改变事件执行多次bug及IE6/IE7/IE8下resize问题:分步介绍,先给大家介绍IE7浏览器窗口大小改变事件执行多次bug,具体问题分析及解决方案请看下文. var resizeTimer = null; $(window).resize(function() { if (resizeTimer) clearTimeout(resizeTimer); resizeTimer = setTimeout("alert('mm')",

如何在IE,Firefox,Opera浏览器中支持页面弹出并回传数据

在IE中, 弹出模态框可直接使用JS方法: ShowModalDialog(), 这个方法在 Firefox3.0以后被支持, 但在较老版本的Firefox和Opera中均不被支持. 需要使 用JS标准的window.open()方法. window.open的语法如下: oNewWindow = window.open( [sURL] [, sName] [, sFeatures] [, bReplace]) 返回当前弹出页面对象. 在弹出窗口中, 可使用window.opener来获得父窗口

编写在浏览器中不弹出警告的ActiveX控件

我们在编写ActiveX控件时,如果用在浏览器中,经常都会弹出现在运行的脚 本不安全的提示, 如果给客户使用,将会带来极大不便.按照MSDN的介绍通常 有两种一种是实现IObjectSafe接口,一种是通过修改注册表的方法.一般如果 用ATL开发ActiveX控件,就用实现ObjectSafe接口的方法.如果用MFC开发,我 觉得还是用修改注册表的方法比较方便.下面我们将第二种方法: 要包 括两个文件 #include "comcat.h" #include "Objsafe

D3JS画出的树状图怎么设置在浏览器中的位置?

问题描述 D3JS画出的树状图怎么设置在浏览器中的位置? 我用D3JS画了一个树状图,但是他的位置一直靠左边屏幕,我想让他显示在浏览器 的中间,请问我应该设置什么参数?

自己写了个web服务器想知道为什么响应报文会出现在浏览器中啊

问题描述 自己写了个web服务器想知道为什么响应报文会出现在浏览器中啊 想知道是什么原因 弄一天了 解决方案 贴出fiddler中看到的response的结果. 解决方案二: 看看是不是加上了不该加的空行,response报文不对,用fiddler调试下. 解决方案三: 你返回的页面内容是什么样的,没有对应html内容,所有浏览器显示不了.浏览器打印了http header 解决方案四: 解决方案五: 浏览器查看源代码看是否 包含响应头的信息,包含说明你的服务器响应头设置有问题,被当做页面内容了

javascript-js中调用ie浏览器,总是会弹出框框,何不让他弹出框

问题描述 js中调用ie浏览器,总是会弹出框框,何不让他弹出框 最近在js中调用打印机,但是又要他不弹出框框,直接打印,windows.print()会弹出框,webbrower的也总是会弹出框,还看到用activeX或者scriptX控件的,如果我不用控件能够实现吗? 求大神帮忙!!! 解决方案 自己写插件应该可以,调用系统默认的去掉不了,调用客户端资源有安全问题

JS中微信小程序自定义底部弹出框的教程

实现微信小程序底部弹出框效果,代码分为html,css和js两部分,具体代码详情大家参考下本文. html <view class="commodity_screen"bindtap="hideModal"wx:if="{{showModalStatus}}"></view> <view animation="{{animationData}}"class="commodity_attr

如何实现chrome浏览器关闭页面时弹出“确定要离开此面吗?”

 这篇文章主要介绍了如何实现chrome浏览器关闭页面时弹出"确定要离开此面吗?"的方法以及相关资料,需要的朋友可以参考下     一.避免弹出提示框 在网上搜了很多,答案大都是设置window.onbeforeunload=null ,但是试用之后无效. 这个问题放了两天之后返回来再次想,终于找到了答案,在此和大家分享一下: 解除jquery离开页面弹出提(1) 先解除绑定在设置弹出内容为null.   代码如下: $(function(){ $(window).unbind('be

各浏览器中querySelector和querySelectorAll的实现差异分析_jquery

querySelector和querySelectorAll是W3C提供的新的查询接口 querySelector和querySelectorAll是W3C提供的 新的查询接口,其主要特点如下: 1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null. 2.querySelectorAll返回匹配的元素集合,如果没有匹配项,返回空的nodelist(节点数组). 3.返回的结果是静态的,之后对document结构的改变不会影响到之前取到的结果. 这两个方法都可以接受三