New Screencast: Columns of Equal Height
There is a new Screencast up in the new videos section.
Forcing multiple columns to be of equal height is one of those tricky things in web design. In this screencast I’ll show you a little trick around it. Instead of making the actual elements themselves equal height, we’ll use a background image to “fake” the look of equal height columns.
You can see right at the top of the sidebar now there is a new feed just for videos. I’ll be posting notifications about new screencasts to this feed as well for for a little while until that new feed grows up and has a little life of it’s own. Does anyone feel that a) they like the notifications here as well or that b) they don’t like the notifications here, that’s what the other feed is for… let me know.















1
hmm a nice trick to remember
Comment by Chocopunk — February 16, 2008 @ 12:22 pm
2
I personally would like to see the videos come up on the main feed, that way i can stay up to date without having to subscribe to 2 feeds (I just use live bookmarks on firefox, so could get crowded!).
Definitely keep the videos coming, they’re really useful.
Comment by Alex :: Web Design — February 16, 2008 @ 12:33 pm
3
i had this problem already some times and this is a nice solution, but what are you doing when you can not use such a background image because for example the design does not “allow” you this?
And the screen-cast is also a nice thing
Comment by stefan eder — February 18, 2008 @ 2:41 am
4
Please post new videos in the news if you can. I don’t subscribe and enjoy visiting the site. Thanks!
Comment by Maximus — February 18, 2008 @ 12:29 pm
5
This trick was originally featured on alistapart.com in January 09, 2004 by Dan Cederholm
http://www.alistapart.com/articles/fauxcolumns/
-
Comment by Alex Wolfe — February 18, 2008 @ 7:43 pm
6
There is a way to do this just with CSS. See http://riddle.pl/-/xhtml/css-equalcolumns/eqcolumns-wrong.html
and
http://riddle.pl/-/xhtml/css-equalcolumns/eqcolumns-okie.html.
There is JQuery involved but only to change amount of content not to set height of columns.
Explanation is here (only in Polish) http://perfectionorvanity.com/2007/03/07/rowne-kolumny-layoutu-css/.
Screencast is good idea - keep it going
Thanks!
Comment by Dario — February 19, 2008 @ 4:58 pm
7
Hi Chris,
I like your screencasts, but I think they drag on too long.
If you could find parts to chop out to make them shorter that would be great.
Or maybe it’s just my pitiful attention span. :/
Comment by Barry — February 24, 2008 @ 11:10 am