Разместване на дизайн

[proba]

Здравейте.
Имам проблем с дизайн под google chrome.

Ето снимка под opera:

http://web-tourist.net/userfiles/4/4141.png

Ето снимка под google chrome:

http://web-tourist.net/userfiles/4/4142.png


Най-горе имам една таблица която е height: 80px;

А отдолу тези 3 таблици:

<table class="table_header">
<tr>
<td class="td_header_left"></td>
<td class="td_header_right">
<a href="index.php" class="a_header_sel" title="Начало"><img src="images/home.png" style="border: none;" alt="Начало" /></a> 
<a href="index.php" class="a_header" title="Файл Мениджър"><img src="images/filemanager.png" style="border: none;" alt="Файл Мениджър" /></a> 
<a href="index.php" class="a_header" title="Бази данни"><img src="images/databases.png" style="border: none;" alt="Бази данни" /></a> 
<a href="index.php" class="a_header" title="phpMyAdmin"><img src="images/phpmyadmin.png" style="border: none;" alt="phpMyAdmin" /></a> 
<a href="index.php" class="a_header" title="Създай фаил"><img src="images/makefile.png" style="border: none;" alt="Създай файл" /></a> 
<a href="index.php" class="a_header" title="Напиши писмо"><img src="images/newemail.png" style="border: none;" alt="Изпрати писмо" /></a> 
<a href="index.php" class="a_header" title="Провери домейн"><img src="images/domain.png" style="border: none;" alt="Провери домейн" /></a> 
<a href="index.php" class="a_header" title="Настройки"><img src="images/settings.png" style="border: none;" alt="Настройки" /></a> 
<a href="index.php" class="a_header" title="Излез"><img src="images/logout.png" style="border: none;" alt="Излез" /></a> 
</td>
</tr>
</table>
<table class="content_left">
<tr>
<td valign="top">
ляв бар
</td>
</tr>
</table>
<table class="content_right">
<tr>
<td valign="top">начална страница</td>
</tr>
</table>

Таблицата в която е менюто:

[css]
.table_header
{
width: 100%;
height: 80px;
margin: 0px;
}
[/css]

Ето и двете td-та на тази таблица:

[css]
td.td_header_left
{
width: 15%;
padding-top: 47px;
margin: 0px;
margin-top: 0px;
padding-bottom: 0px;
}

td.td_header_right
{
width: 85%;
padding-top: 47px;
margin: 0px;
margin-top: 0px;
padding-bottom: 0px;
}
[/css]

След това лявата таблица:

[css]
width: 15%;
float: left;
border: none;
height: 500px;
background: #FFFFFF;
color: #000000;
border: 1px #3399FF solid;
border-right: 0px;
margin-top: -3px;
[/css]

и дясната таблица с надписа "начална страница"

[css]
width: 85%;
height: 500px;
float: right;
border: 1px #cccccc solid;
border-top: 0px;
background: #FFFFFF;
padding-left: 20px;
margin-top: -3px;
[/css]

Пробвах да променя margin-top да е -29px тъй като за друг вариант немога да се сета понеже не съм навътре в css-a но така пък се оправя под google chrome а се разваля под опера.
Някакво предложение как да оправя този проблем ?

EDIT:

С този малко промених кода и сега когато задам padding-top: 43px е добре под opera.
Но под chrome е наместено на 47px.

Някакви 4 пиксела бягат между двата браузъра.
Промених в поста си css кода.
Идея откъде идва този проблем ?

 

[proba]

Пиша ново мнение , защото като редактирам старото никой не поглежда темата.

Добре как тогава да да залепя горното tr за долното.
Ето примерен код:

<table>
<tr>
<td style="border: 1px #eee solid;"> menu </td>
</tr>
<tr>
<td style="border: 1px #eee solid;"> content </td>
</tr>
</table>

Как да стане така че бордерите на 2те td-та от горното и долното tr да са залепени едно до друго а не да има разстояние между тях както сега ?
Какъв css код да добавя за да се залепят ?

 

[tedo96]

[css]border-collapse: collapse;[/css]

 

[proba]

Пак имаше разместване и проблеми но се оправих.
Все пак + понеже за разлика от някой , се опита да помогнеш ;]]