Question

I am sure this is something stupid I’m doing, but it’s been quite a while since I messed with CSS. And for the life of me I cannot figure out why the div boxes are not displaying the right height (as specified in the CSS)…and why there is that black block of space between header divs and the columns.

Any help would be VERY appreciated! I know it’s pretty bare-bones, I’m just trying to get the main layout down.

Thanks for any help!!
CSS:

#container { width: 1000px; margin: 30px auto 60px;}

    h1 { text-align: center;}

    #header { height: 200 px; width: 1000 px;  background-color: #993300}
    #mcol1 { height: 600; width: 500px; float: left; background-color: #2a9c3b;}
    #mcol2 { height: 600; width: 500px; float: left; background-color: #996666;}

HTML:

<div id="container">

<div id="header">
<h1> Name</h1>
</div>
<div id="mcol1">
<h1>Test1</h1>
</div>

<div id="mcol2">
<h1>Test2</h1>
</div>
</div>

</body> 

Since I can’t directly post pictures because I’m new, here’s a link to how it’s displaying: https://i.stack.imgur.com/L0I85.jpg
Thanks!

Answer 1

Not

height: 200 px; 
height: 200;

but

height: 200px;