не могу дойти как сделать. Комбинация дивов и таблиц. Резиновый эффект

SibBear · March 9, 2008

Собственно продолжение темы контейнер внутри ячейки

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="Config/style.css" />
</head>

<body style="padding:0px;margin:0px;">


<div id="back"><img src="background.jpg" border="0" height="100%" width="100%"></div> <!-- Подложка картинка 100на100% -->

<div align="center" id="page"> <!-- Тело -->



<table style="height:100%; width:100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
 <td valign="top">

 <table border="0" width="100%" height="40px" class="transparent">
 <tr>
 <td align="center">TOP</td>
 </tr>
 </table>

 </td>
 </tr>
 <tr>
 <td height="100%" valign="middle" align="center">



<table border="1" width="100%" cellspacing="0" cellpadding="0" height="100%">
 <tr>
 <td> </td>
 <td> </td>
 <td> </td>
 </tr>
 <tr>
 <td> </td>
 <td width="90%" height="80%" align="center" >


<div id="middle">


 <table border="1" width="100%" height="500px" class="transparent">
 <tr>
 <td align="center">FIXED TABLE</td>
 </tr>
 </table>


</div>




 </td>
 <td> </td>
 </tr>
 <tr>
 <td> </td>
 <td> </td>
 <td> </td>
 </tr>
</table>


 </td>
 </tr>
 <tr>
 <td align="center" valign="bottom">
 <table border="0" width="100%" height="40px" class="transparent">
 <tr>
 <td align="center">BOTTOM</td>
 </tr>
 </table>
 </td>
 </tr>
</table>



</div>



</body>
</html>

CSS

* html body {
 padding: 0px;
 margin: 0px;}

* html page{
 position: absolute;
 min-height: 100%;
 margin: 0 0 0 0;
 top: 0;
 left: 0;
 z-index: 2;}

#back {
 position: absolute; 
 width: 100%; 
 height: 100%;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 margin: 0 0 0 0;
 z-index: 1;}

#page {
 position: relative;
 min-height: 100%;
 margin: 0 0 0 0;
 top: 0;
 left: 0;
 z-index: 2;}


#middle {

 height: 100%;
 width: 100%;
 overflow: auto;}




.transparent {
 background: #333333;
 color: #FFFFFF;
 font-family: Arial;
 font-size: 10pt;
 opacity: 0.8;
 filter: alpha(opacity=80);
 -moz-opacity: 0.8;}

Эффект срабатывает в IE (это странно, но видмо потому что он глючный а я неправильно пишу, глюки + ошибки = нужный эффект).

В опера и мозила таблица вылазит.

Помогите придумать вариант?

посмотреть все это хозяйство можно здесь: www.naryad.ru/test2.php

Забыл сказать. Смотреть в разных браузерах и обязательно попробовать ресайз. Заметите разницу

Sign In

не могу дойти как сделать. Комбинация дивов и таблиц. Резиновый эффект

Question

SibBear

Link to comment

Share on other sites

0 answers to this question

Recommended Posts

Обсуждения

Forums

Important Information