---
title: "关于ie6下a标签的haslayout问题."
url: "https://yjyj.net/learn/1606.html"
author: "小 虾 (生猛大蝦编辑部)"
published_at: "2010-10-23T13:45:19+08:00"
updated_at: "2010-10-23T13:45:51+08:00"
categories: "招数学习"
tags: "CSS布局技巧, 前端开发实战"
summary: "本文聚焦 IE6 下 a 标签相关的 haslayout 异常与兼容性折腾，顺带解决 fixed 定位在旧版 IE 中的历史遗留问题。作者给出可直接套用的 IE6 触发方案，并总结出更稳妥的前端排障思路，适合还在处理老旧浏览器兼容的开发者参考。"
source: "生猛大蝦 (https://yjyj.net)"
---

# 关于ie6下a标签的haslayout问题.

> 来源：[生猛大蝦 (yjyj.net)](https://yjyj.net/learn/1606.html) · 作者：小 虾 · 发布时间：2010-10-23

## 30 秒核心看点 (TL;DR)

- IE6 下 a 标签的 haslayout 问题，可用 display、height、float、position、width、writing-mode、zoom 等属性触发。
- 文章同时处理了 IE6 fixed 定位失真，避免 absolute 元素被连带影响，实战排障很接地气。
- 核心结论：老 IE 兼容别硬扛，先定位问题，再用最小改动触发布局特性解决。

已经有几个客户跟我反映,[**半像素创意设计**](http://www.halfpx.com/)的站点在ie下有问题.

  正好今天起了个大早,顺便把[**半像素创意设计**](http://www.halfpx.com/)以前的历史遗留问题全部解决掉.

  已经2010年底了,ie6依然是个无比淫荡又邪恶的软件.又被我天朝伟大的盗版系统事业以及牛逼的网银系统给无限扩大化,后果就是伟大的前端工作者们悲哀的奋斗在每一个可以温香软玉抱满怀的销魂夜晚,消耗着自己的如花的青春和宝贵的生命...每次想起ie6都让我情不自禁的想大骂一通.

    

  废话不扯多了,今天解决了2大历史遗留问题,一个是IE6下的fixed定位,开始使用的相对定位办法是在让人恼火,页面中所有的position: absolute都tnnd被强奸了.导致页面一拖动就一塌糊涂.苦苦搜寻下找到了一个很棒的解决办法,来自一个牛逼的小伙子:[http://www.planeart.cn/?p=877](http://www.planeart.cn/?p=877).使用之后果然腰不酸腿不痛上下楼也有劲了.

  第二个是haslayout的问题,以前从来没有碰到过,看来是俺水平太差,几年了都没接触到这么高端的东东过.那么解决办法也很简单,ie6下设置:

  * display: inline-block   
* height: (任何值除了auto)    
* float: (left 或 right)    
* position: absolute    
* width: (任何值除了auto)    
* writing-mode: tb-rl    
* zoom: (除 normal 外任意值)

  解决方案和解惑来自于:[http://www.qianduan.net/comprehensive-haslayout.html](http://www.qianduan.net/comprehensive-haslayout.html)

  最后,还是想要深情的吼一句:IE6你个纯傻逼!

## 延伸问答与排错指南 (FAQ)

### IE6 下 a 标签为什么会有 haslayout 问题？
在 IE6 里，某些元素会因为布局触发条件不同而出现 haslayout 异常，进而引发显示或定位问题。处理思路是给元素加上能触发布局的属性，例如设置非 auto 的 width、height，或使用 zoom 等方式，让它进入稳定布局状态。

### IE6 下怎么快速让元素触发 haslayout？
可尝试给元素设置 display:inline-block、height 非 auto、float、position:absolute、width 非 auto、writing-mode:tb-rl，或 zoom 为非 normal 值。实际使用时不必全加，选一种最小改动且不破坏页面结构的方式即可。

### IE6 的 fixed 定位问题怎么处理更稳？
文章里提到的思路是采用替代方案来模拟 fixed 效果，避免直接使用会导致页面拖动错乱。实操上应优先检查定位层级和绝对定位元素是否被影响，再用兼容写法逐步替换。

---
更多 Linux 运维、WordPress 性能优化、前端工程化、Shopify 独立站与极客折腾指南：[生猛大蝦全站文章归档 (https://yjyj.net/archive)](https://yjyj.net/archive)
