Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by mrx3
mrx3
8,742 Points

Having some trouble getting my columns to be the same height. (Codepen included).

I'm having some trouble getting my columns to extend all the way to the bottom evenly. As you can tell buy my Codepen the nav and aside are way different in height. I've tried various height and padding-bottom properties but, I can't seem to figure out how to get this done properly.

Could someone here please give me a hand in with this please. Thank you in advance for any help. I really appreciate it.

Codepen: http://codepen.io/mike316/pen/YPjXRK

1 Answer

Harley Urquhart
Harley Urquhart
26,203 Points

use a wrapper set the wrappers height to auto and give it a background for testing and make sure the nav an aside don't have a background set you tallest column to have a background color and your problem is solved setting columns without javascript to have same height is not really possible sorry ... hope this solves your problem

http://codepen.io/anon/pen/XJBmew

Harley Urquhart
Harley Urquhart
26,203 Points

oh don't forget to clear any floats when using the wrapper otherwise you will have problems

mrx3
mrx3
8,742 Points

Thank you so much Harley, I really appreciate it. Sorry it took me so long to get back to you. I went to bed shortly after you replies. I also gave the best answer, you deserve it. Thanks so much again!!!!!