Posts Tagged ‘CSS’

margin:0px auto在IE中失效的解决方案

星期日, 五月 19th, 2013 38 views

这个问题其实是N年前的问题了,刚刚遇到一个网站需要修复首页的错位问题,因此写下来顺带温习一下:
错位的表现为网站主框架DIV,即warp不居中,准确的说是在IE中不居中,firefox、chrome浏览器无此bug。

检查网站源码发现缺少了一个DOCTYPE声明
在网站首页代码最顶部添加如下代码:

1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"]

保存后即可成功居中。
多数在IE浏览器中margin:0px auto失效的情况均为缺少这个DOCTYPE声明造成的。

BeiTown
2013.05.19

利用JS+CSS去除网站绑定广告

星期日, 十二月 30th, 2012 76 views

应Eric同学邀请,出手帮忙去掉免费服务器的一个附带广告。广告如下,是一个右下角悬浮广告:

用火狐FireBug看了一下源码,该广告的代码如下:


(更多…)

纯CSS右下角DIV浮动方法

星期五, 十二月 21st, 2012 85 views

做一个右下角浮动的DIV,之前考虑用JS来取浏览器高度,然后利用float:right; margin:浏览器.hight-DIV.height来做。但根本不需要这么复杂。

代码如下:

1
2
3
4
5
6
7
8
<div style="width:100px;
            height:100px;
            background-color:#fff;
            right:0px;
            bottom:0px;
            position:fixed;"
>
          TEST DIV
</div>

但此代码只在FireFox、Chrome及IE6以上浏览器下有效,要支持IE6则需要将position改成absolute

1
2
3
4
5
6
7
8
<div style="width:100px;
            height:100px;
            background-color:#fff;
            right:0px;
            bottom:0px;
            position:absolute;"
>
          TEST DIV
</div>

这个时候所有浏览器的效果都统一了,但是有一个弊端就是不会随着滚动条滚动。
所以如果需要精确控制DIV的位置,推荐的方案还是使用JS。

BeiTown
2012.12.21