While looking for a solution for the thread called "background repeat of the left cotainer based on middle container" on the WebMasterWorld Forum I automatically thought of using tables. It is definitely the easiest but its browser support is not the best (see Seven Reasons to go Table Free). So digging a bit further first I found the perfect keyword to look for in a search engine: Equal Height Columns.
Most of the posts and articles talk about using tables, JavaScript or the "Faux Columns" solution, although probably the cleverest is Using Separate Background Color <div> elements for the background of each column - have to say, it's a bit complicated though, not so easy to grasp the meaning of it. The post about Four Methods to Create Equal Height Columns explains all options very clearly also listing the advantages and disadvantages of each.
I think the best of all however is described in the blog post Equal Height Columns using CSS - again, after the tables, JavaScript and the "Faux Columns" method it explains "Another Way" that is extremely simple: adding overflow: hidden, padding-bottom: 2000px and margin-bottom: -2000px, case closed! :)
Sunday, May 02, 2010
CSS Equal Height Columns
AboutMe
I'm a talented website designer with the main goal of satisfying the customer. I'm precise, easy-going, simple, solution-driven and kind. Other than websites, I'm happy to provide any kind of picture editing to make sure your website looks the way you want it to be; to create a logo or even an animated banner.
Nothing is impossible and everything is manageable!ContactMe
I'm a talented website designer with the main goal of satisfying the customer. I'm precise, easy-going, simple, solution-driven and kind. Other than websites, I'm happy to provide any kind of picture editing to make sure your website looks the way you want it to be; to create a logo or even an animated banner.
Nothing is impossible and everything is manageable!ContactMe
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment
Dear legitimate commenters, please post your comments below. I'd be happy to receive your feedback; helps me a lot improving, or getting reassurance that I'm doing something really great here.
IMPORTANT! A note to commenters planning on advertising their business in comments: please be informed that I'm NOT going to post your comments but will ALWAYS mark them as SPAM.