我想伸展我的红色content
cless 从页脚延伸到页眉。我知道如果我用内容填充它会,但我如何让它按原样伸展?
您可以在此处克隆项目
相关代码:
html:
<body>
<div class="wrapper">
<div class="header">
<div class="nav">
<div class="logo">
<strong>
<a href="index.html">
<img src="images/logo.png" alt="Sam Jarvis logo"/>
</a>
</strong>
</div>
<div class="menu">
<ul>
<li><a href="#home">HOME</a></li>
<li><a href="#about">ABOUT</a></li>
<li><a href="#work">PORTFOLIO</a></li>
<li><a href="#clients">CONTACT</a></li>
</ul>
</div>
</div>
</div>
<div class="content">
</div>
</div>
<div class="footer">
<div class="footercontent">
<p>© 2013 Friend | Design and Development. All Rights Reserved.</p>
</div>
</div>
<script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>
</body>
CSS:
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -6.25em;
}
.header {
width: 100%;
height: 100px;
background-color: #000000;
margin: 0 auto;
font-family: 'Open Sans', sans-serif;
font-weight: 300;
}
.content {
width: 1000px;
border: 1px solid #ff0000;
margin: 0 auto;
height: 100%;
min-height: 100%;
}