vote up 0 vote down
star

Assume that

  • I want a two-column layout, say 200px wide navi and 400px wide content.
  • Either column can have an arbitrary amount of text (so I can't assume that the content is always taller than the navigation, for example).
  • I'd like both columns to have the same height, which is the maximum of the heights they would naturally have.

There are lots of 2-column layout examples on the web, but they either depend on the other column always being taller, or use tricks like colored background images of fixed width.

Are tables or javascript the only options?

flag

1 Answer

vote up 0 vote down 
/* css code */
#mypage
{
 display:table-cell;
}

#mypage p
{
 display:table-row;
   width:200px;
}

#mypage p + p
{
 width:400px;
}

enter code here

link|flag

Your Answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.