Помилка з блочними посиланнями в IE6
У IE6 є деякі помилки, пов'язані з властивістю hasLayout. Її не можна встановити прямо, але можна зробити це косвенно. Більшість проблем, пов'язаних з цією властивістю, можна виправити, встановивши zoom: 1 або height: 1% для елементу в стилях. Ці властивості, крім своїх основних характеристик, встановлюють hasLayout.
Блочні посилання - це прийом, який активно використовується в різних меню для збільшення корисної площі посилання. У IE6, якщо посилання встановлене як блок за допомогою display: block, воно не займає доступного простору батьківського елемента, і посиланням є лише текст. Ця помилка виявляється, коли до батька додається властивість float (див. приклад 1).
Приклад 1. Блочні посилання
XHTML 1.0CSS 2.1IE 6IE 7+CrOpSaFx
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Блочні посилання</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
DIV {
background: #ffc; padding: 1%; text-align: center;
float: left; width: 98%;
}
DIV A { display: block; }
</style>
</head>
<body>
<div><a href="#">Посилання на всю ширину</a></div>
</body>
</html>Проблему можна вирішити, встановивши hasLayout для блочних тегів <a>, наприклад, за допомогою zoom.
<!--[if IE 6]>
<style type="text/css">
DIV A { zoom: 1; }
</style>
<![endif]-->