20.05.2013 02:58:16 Таблица в Opera Сообщение #1
Дмитрий184
Мастер
Дата регистрации:
29.06.2012 08:48:56
Сообщений: 225
Здравствуйте, Михаил!
Я создал таблицу, потом стал проверять как выглядит страница в разных браузерах - в браузерах IE, Firefox, Chrome таблица выглядит одинаково. А вот в браузере Opera неправильно отображается высота ячеек. Как я понимаю, высота ячейки складывается так - height + padding-top + padding-bottom Но в браузере Opera высота ячеек вычисляется иначе. Как можно исправить ситуацию, чтобы высота ячеек была одинаковой во всех браузерах? Вот пример кода.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>ТАБЛИЦА</title>
<style type="text/css">
table{
border: 1px solid #000;
}
td {
border: 1px solid #000;
width: 200px;
height: 70px;
padding: 30px 0 20px;
}
</style>
</head>
<body>
<table>
<tr>
<td>111</td>
<td>222</td>
</tr>
<tr>
<td>333</td>
<td>444</td>
</tr>
<tr>
<td>555</td>
<td>666</td>
</tr>
</table>
</body>
</html>
Я создал таблицу, потом стал проверять как выглядит страница в разных браузерах - в браузерах IE, Firefox, Chrome таблица выглядит одинаково. А вот в браузере Opera неправильно отображается высота ячеек. Как я понимаю, высота ячейки складывается так - height + padding-top + padding-bottom Но в браузере Opera высота ячеек вычисляется иначе. Как можно исправить ситуацию, чтобы высота ячеек была одинаковой во всех браузерах? Вот пример кода.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>ТАБЛИЦА</title>
<style type="text/css">
table{
border: 1px solid #000;
}
td {
border: 1px solid #000;
width: 200px;
height: 70px;
padding: 30px 0 20px;
}
</style>
</head>
<body>
<table>
<tr>
<td>111</td>
<td>222</td>
</tr>
<tr>
<td>333</td>
<td>444</td>
</tr>
<tr>
<td>555</td>
<td>666</td>
</tr>
</table>
</body>
</html>
