Troubles achieving a simple layout ( 2 rows each a different colour )

[pablo_asawa]

I am having trouble achieving a certain layout where the header takes up 50% of the viewport height and 100% of the width and the footer takes up 50% of the viewport height and 100% of the width. The header is supposed to be green and the footer white.The colours are working, but not the heights. The heights are only fitting to the amount of content each element has.Any idea why and how to fix it?Also, I know the heights add up to more than a 100%. I'm trying to trigger a scroll-bar, too.