Css: высота элемента в 100% — 100px

Да, `calc`-ом оно делается ровно так (`100%-100px`).
Но его не все браузеры до сих пор умеют, так что вот ещё один способ:

<body>
<div class="header"></div>
<div class="main"></div>
</body>
body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

.header {
	width: 100%;
	height: 100px;
	background-color: blue;
	box-sizing: border-box;
	padding: 0;
}

.main {
	position: absolute;
	top: 100px;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: red;
}


JS Bin

2 комментария so far.

  1. bullgare:
    для наглядности

LEAVE A COMMENT