højde på <div> #container
HejsaSidder med en lille side hvor jeg har en header. topimg, menu og footer med fast højde og en container der skal fylde resten, men det kan jeg simpelthen ikke få den til :(
CSS:
body{
font-family:'Tahoma', sans-serif;
background-color:#d5d5d5
}
#header{
height:70px;
background-color:#3a3a3a;
width:100%;
text-align:center;
line-height:70px;
color:#fff;
}
#topimg{
width:100%;
height:220px;
background-image:url(../img/88.jpg);
background-size:cover;
}
#menu{
height:60px;
background-color:#3a3a3a;
width:100%;
color:#fff;
line-height:60px;
}
#container{
margin:0 auto;
width:950px;
background-color:#fff
}
#footer{
position:bottom;
bottom:0;
height:40px;
line-height:40px;
background-color:#3a3a3a;
width:100%;
color:#fff;
}
HTML:
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div id="header">Top</div>
<div id="topimg">Top Image</div>
<div id="menu">Menu</div>
<div id="container">Container</div>
<div id="footer">Footer</div>
</body>
</html>
Jeg fandt et andet spørgsmål angående det, hvor man skulle bruge
#container{min-height:calc(100%-fast højde, i mit tilfælde 390); men den kan jeg ikke få til og virke. Nogen der har nogen forslag? :)