100％高度div容器不使用标题

Question

请参阅http://jsfiddle.net/oedev/pag7ahz2/

我有以下页面布局：

• cMain - 主页面容器
• cBanner - banner container
• cNavigation - 导航容器
• cContent - 页面内容容器

所有这些都是100％的大小，因为我希望页面内容的大小为100％（除了横幅）。

html, body {
    height: 100%;
}

#cMain {
    height: 100%;
}

#cBanner {
    background: #002d62 top center no-repeat scroll;  
    height: 200px; 
    margin-bottom: 1em; 
    margin-top: 1em;    
}

#cContent {
    height: 100%
}

我已将html，body和包含div的高度设置为100％。

但是，由于我有一个标题徽标和导航栏，因此这些下面的div的大小不是100％（我以滚动条结束）。

如果我删除标题和导航条div，则内容div的大小为@ 100％，没有滚动条。

Answer 1

从身体标签中移除身高。

html {
    height: 100%;
}

或者设置身体的最小高度，如以下帖子所示：Make body have 100% of the browser height

html {
    height: 100%
}
body {
    min-height: 100%;
}