Не понимаю поведение элементов часть 2

shtuceron · May 21, 2012

Добрый день,

Написал очень простенький код, с которым не должно было возникнуть вопросов, но...

в браузере IE верхняя строка таблицы не равна заданным 30px. Высота этих двух строк делит пополам эту таблицу.

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
	html, body {
		width: 100%;
		height: 100%;
	}

	table {
		width: 100%;
		height: 100%;
		border: 1px green solid;
	}

	#wrap {
		width: 100%;
		height: 100%;
		border: 1px red solid;
	}

	#firstRow {
		height: 30px;
		border: 1px blue solid;
	}
</style>
</head>
<body>
<div id="wrap">
	<table>
		<tr>
			<td id="firstRow">top</td>
		</tr>
		<tr>
			<td>bottom</td>
		</tr>
	</table>
</div>
</body>
</html>

Как можно задать верхнюю строку таблицу жестко, а вторая строка занимает весь оставшийся размер по высоте.

Спасибо.

Avalon4eg · May 21, 2012

розбить таблицу на thead и tbody

SelenIT · May 21, 2012

IE, надо полагать, свалился в Compatibility View и работает в режиме IE7 (нужно убрать в настройках Tools — Compat. View Settings — Display Intranet... и, на всякий случай, поставить метатег X-UA-Compatible IE=Edge)?

В IE8+ нет никаких проблем и так. В IE7-, насколько я в курсе, со стандартным доктайпом никак не решается, но, по-моему, на них уже можно смело забивать. А вообще для такой структуры точно таблица нужна?

shtuceron · May 21, 2012

У меня требования IE 7+

Не уверен точно, что нужна таблица, можно конечно списками обойтись, но таблица более "строгая" что ли)

Sign In

Не понимаю поведение элементов часть 2

Question

shtuceron

Link to comment

Share on other sites

3 answers to this question

Recommended Posts

Avalon4eg

Link to comment

Share on other sites

SelenIT

Link to comment

Share on other sites

shtuceron

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information