Вчера мучался с версткой очередного сайта http://newstram.ru/, глюк был как всегда в ИЕ6, даже ИЕ7 отображал все корректно.
В общем глюк известный, но мне хотелось как можно меньше использовать CSS-хоков (не люблю я эти фишки), стараюсь вообще обходиться без них (иногда не получается), при этом верстка всегда кроссбраузерная.
Глюк был в следующем (для примера, приведу код):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style>
#block1 {
border: 1px solid red;
float: right;
width: 100px;
height: 100px
}
#block2 {
border: 1px solid green;
height: 100px
}
</style>
</head>
<body>
<div id="block1"></div>
<div id="block2"></div>
</body>
</html>
В основных браузерах (ФФ, Опера, ИЕ7) отображается нормально, а вот в ИЕ6 почемуто между блоками появляется отступ в 3px.
Начал бороться с проблемой, выяснил, что если второму блоку прописать float: right, то глюк в ИЕ6 исправляется, но тогда в других браузерах происходит палево. Метод явно не подходит. Начал искать решение в интернете, решение было найдено:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style>
#block1 {
border: 1px solid red;
float: right;
width: 100px;
height: 100px
}
* html #block1{
position: relative;
left: -3px;
margin-right: -3px
}
#block2 {
border: 1px solid green;
height: 100px
}
</style>
</head>
<body>
<div id="block1"></div>
<div id="block2"></div>
</body>
</html>
На нем и остановился...
