Рассскажите своему работодателю, что есть файлы с названиями ie6.css и ie7.css, которые позволяют достичь кроссбраузерности.
Кстати, inline-block в ie6 и ie7 по функциональности заменяется на display:inline; zoom1; Замена производится только в этих двух файлах, поэтому на остальные браузеры не влияет. В остальном свойство кроссбраузерно (про указание vertical-align:top и убирание пробелов между элементами наверое все знают).
Так, теперь насчёт кода. В Opera 10.51/9.64 скрипт тормозит только из-за стилей "a_l" (они закомментированы). Удаление position relative и прочее на Оперу особого влияния не произвело (скорость увеличилась на 0.1с), а вот Хром ведёт себя немного по другому. Удаление стилей "a_l" так же как и в Опере, сразу разгоняет скрипт (примерно на 1с), но также на ускорение влияет удаление position:relative либо min-height. Прикрутил заодно таймер, в миллисекундах, а то на глаз иногда неразличимо.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style>
html,body {
margin:0;
padding:0;
height:100%;
}
body {
background:aqua;
position:relative;
}
.page {
min-height:100%;
}
#num {
position:absolute;
top:100px;
left:200px;
height:0;
overflow:hidden;
border:1px solid blue;
}
/*
.a_l {
position:absolute;
background:red;
top:96px;
left:178px;
bottom:51px;
width:1px;
}
.a_r {
position:absolute;
background:red;
top:96px;
right:0;
bottom:51px;
width:1px;
}
.a_b {
position:absolute;
background:red;
bottom:45px;
left:184px;
right:6px;
height:1px;
}
.a_bl {
position:absolute;
background:red;
bottom:45px;
left:178px;
width:6px;
height:6px;
}
.a_br {
position:absolute;
background:red;
bottom:45px;
right:0;
width:6px;
height:6px;
}
*/
p {
margin:0;
padding:0;
}
</style>
<script>
xxx='';
function slide(el,i,j) {
if (i!=j) {
el.style.height=++j+'px';
setTimeout(function() { slide(el,i,j) },0);
}
else end();
}
function begin() {
var date1=new Date();
xxx=date1.getTime();
slide(document.getElementById('num'),180,0)
}
function end() {
var date2=new Date();
alert(date2.getTime()-xxx);
}
</script>
</head>
<body>
<div class="page">
<input type="button" value="Run" onclick="begin()">
<div id="num">1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br>10</div>
<p class="a_l"></p><p class="a_r"></p><p class="a_b"></p>
<p class="a_bl"></p><p class="a_br"></p>
</div>
</body>
</html>
Если у "a_b" увеличить height до 2-х пикселей, то в Опере скрипт разгонится примерно на 50%, но неполностью, тоже странный факт.