lỗi IE6. Độ cao của Div tăng khi a: hover được kích hoạt

Question

Tôi có một trang có danh sách "thẻ", giống như ở đây trong SO và khi chuột ở trên, nó sẽ tối hơn.

Nó hoạt động tốt với Ie7, 8, FF, Chrome, Safari, v.v ... nhưng IE6 có lỗi khi a: hover được kích hoạt.

Lỗi là div mà những (ul li a) được chứa, được tăng chiều cao.

css tôi có là:

div.options ul.tags li a:hover 
{ 
    background-color: #D5E4A5; 
} 

nếu tôi xóa kiểu này hoặc chỉ bình luận "background-color: # D5E4A5;" nó không xảy ra ...

bất kỳ ý tưởng nào về cách khắc phục?

cảm ơn!

EDIT: Dưới đây là một ảnh chụp màn hình của lỗi: (? Hay là bên lề)

alt text http://i38.tinypic.com/28bvhxf.jpg

Answer 1

vừa sửa nó! : D

những gì tôi đã có trước là:

<div class="options clearfix"> 
    <!--content here--> 
</div> 

và tôi thay thế cho:

<div class="options"> 
    <div class="clearfix"> 
     <!--content here--> 
    </div> 
</div> 

Bây giờ IE6 là hạnh phúc, và tôi hạnh phúc cũng ...

Cảm ơn tất cả mọi người đã giúp đỡ của bạn!

Answer 2

Tôi nghĩ tôi chạy vào này một lần, và những gì đã xảy ra là biên giới đã được sửa đổi tôi cuối cùng đã kết thúc, và chỉ cho các phần tử có vấn đề một đường viền trong suốt 1px và gọi nó là một ngày.

Tôi thực sự nghi ngờ điều này sẽ trở thành giải pháp của bạn, nhưng tôi hy vọng nó sẽ cung cấp cho bạn một số ý tưởng trong đó hướng để xem xét!

Answer 3

Tôi cũng đã xảy ra với tôi, nhưng tôi không thể nhớ chính xác nơi đó. Tôi nghĩ rằng tôi đã giải quyết nó, nhưng tôi không hoàn toàn chắc chắn như thế nào nữa. Tôi có thể nghĩ đến hai điều:

1. Cung cấp cho phần tử "layout". Tôi có xu hướng làm điều đó với zoom: 1.

2. Thêm vertical-align: top vào phần tử a hoặc li.

Bạn có thể cung cấp ví dụ mã đầy đủ hơn không? Tôi không thể tái tạo nó chỉ với CSS đó.

Answer 4

Bạn có chỉ định chiều cao cho div đó một cách rõ ràng không? Nếu không, thiết lập chiều cao có thể làm cho điều này biến mất.

Answer 5

Các thẻ có nằm ở nơi bạn có thể cung cấp màu nền cho tất cả thời gian không? Nếu vậy, thiết lập màu nền của chúng khi: hover không được kích hoạt vẫn khiến chiều cao thay đổi?

Lưu ý, tôi không thể sao chép HTML đã cho khớp với quy tắc bạn đã mô tả, do đó vấn đề có thể đến từ một nơi khác cao hơn trên trang.

<!-- This does not display the described behavior --> 
<div class="options"> 
    <ul class="tags"> 
    <li><a href="#">c++</a></li> 
    <li><a href="#">not-programming-related</a></li> 
    <li><a href="#">cheese</a></li> 
    <li><a href="#">barnacle</a></li> 
    </ul> 
</div> 

Điều tốt nhất tôi có thể đề xuất là làm những gì người chia bài nói và bố cục yếu tố.

EDIT: Chỉ cần một shot trong bóng tối, nhưng bạn có thể muốn thử thiết lập giá trị cho line-height trên div.options.

EDIT 2: Sau khi nhìn thấy ảnh chụp màn hình của bạn tôi nhớ lại rằng tôi đã có vấn đề này tại nơi làm việc trước đây, và việc sửa chữa trong trường hợp của tôi là để thêm position:relative; zoom:1; để container (hoặc có thể liên kết, tôi quên!) . Hãy thử điều đó?

EDIT 3: Sau googling đối với một số giải pháp, bạn có thể thử đặt chiều cao nếu vùng chứa của bạn rõ ràng. Nếu this không hoạt động, tôi không biết phải làm gì!

Answer 6

Đây thường là bộ nhận đường viền không được xác định ban đầu. Thử đặt đường viền trên DIV đang tăng lên thành màu nền mặc định. Tôi đoán là bạn sẽ không thấy anyting phát triển nữa.

Answer 7

Tôi cũng gặp sự cố chính xác này. Kích hoạt chắc chắn là màu nền trên di chuột, nhưng các giải pháp thông thường của việc cung cấp cho cha mẹ hasLayout không hoạt động, tôi nghĩ vì làm tổ các thẻ A bên trong các thẻ khác. Từ những gì tôi đã kết thúc, giải pháp làm tổ của bạn là sửa lỗi rõ ràng là logic đúng: tách phần tử vi phạm, phụ huynh và các đối tượng xóa.

Các giải pháp tôi đã làm được những điều sau đây:

<div class="options"> 
<!--content here--> 
<!--[if lte IE 6]><div class="ie6clear"></div><![endif]--> 
</div> 

Với CSS sau đây:

.ie6clear{ clear:both; height:0; overflow:hidden; } 

Bằng cách này, clearfix CSS chỉ áp dụng cho IE6, nhấn mạnh những gì đánh dấu không liên quan là, và giúp dễ dàng xóa khi IE6 không còn được hỗ trợ.