css - Equal height divs (two column)

Question

I tried using JQuery for this, but kind of got lost... so I'm trying to do it with CSS now

http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks

I basically want to do this but with two columns, so there are two divs centered nicely in the page with equal heights, I'm pretty new to css so sorry if this is a repetitive/obvious question.

Any help is appreciated Thank you!

Answer 1

If you are trying to modify the code from the link, all you need to do is modify the css:

     #container1 {
       float:left;
       width:100%;
     }

     #col1 {
       float:left;
       width:50%;
       background:red;
     }

     #col2 {
       float:left;
       width:50%;
       background:yellow;
     }   

And I would declare your background color as a hex value and in the container itself, unless of course you want two different color backgrounds for your columns.