Здравствуйте! Хочу сделать эмуляцию оконного интерфейса в html. т.е. должны быть Заголовок, Контент, по бокам "боковины окна", Подвал.

Контенет должен прокручиваться, так что бы Заголовок и Подвал всегда были на своих местах. т.о. общая прокрутка браузера не годится.

Я сверстал - ниже приведен код - но у моей верстки есть значительный минус - стрелочки у полос прокрутки прячутся под Заголовком и Подвалом.

Единственное решение которое я вижу, это определять размер рабочей области сайта подбирать и подставлять высоту блока #commonBlock для каждого из разрешений .... а без JS?

Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Scroll in center</title>

<style type="text/css"><!--

html {height: 100%;}
body {min-width: 1000px; min-height: 100%; margin:0; padding:0; background:#fff;}



#header { * * * /*стиль для фиолетового заголовка */
 * *height:95px;
 * *width:100%;
 * *position: absolute;
 * *z-index:3;
}


#sideLeft { * * * /*стиль для левой красной полоски */
 * *position:absolute;
 * *left:0;
 * *top:0;
 * *padding:0;
 * *width:8px;
 * *height:100%;
 * *z-index:1;
}

.sideRight { * */*стиль для правой красной полоски */
 * *position:absolute;
 * *top:0;
 * *right:0;
 * *padding:0;
 * *width:8px;
 * *height:100%;
 * *z-index:1;
}

#commonBlock { * /*стиль для общего 100%-высотного блока с прокруткой */
 * *width: 100%;
 * *height:100%;
 * *position:absolute;
 * *right:9px;
 * *top:0;
 * *padding:0;
 * *overflow: auto;
}

#textBlock { * */*стиль для позиционирования текста - что б вылезал из за заголовка и подвала */
 * *padding:100px 12px 40px 21px;;
}

#footerCommonBlock { */*стиль для фиолетового подвала */
 * *width: 100%;
 * *height: 37px;
 * *position: absolute;
 * *bottom:0;
 * *z-index:3;
}

//--></style>



</head><body>



<div id="commonBlock" style="background:#9cc;">
 * *<div id="textBlock">
 * * * begin text
















































 * * * content
















































 * * * * end text
 * *</div>
</div>







</body></html>