css - CSS：两列，平衡高度，优先选择左列

我有一个有序的电影列表。每部电影都有名称和描述。描述长度各不相同。我将这些电影逐一列在两列中，大致如下：

1. Blues Brothers                      |  4. Lord of the Rings
   Cheesy movie about two guys.        |     A hobbit and his buddies go
                                       |     to destroy some ring.
2. Jurassic Park.                      |
   Some guy makes dinosaurs and some   |  5. Can't Think Of Any More
   chick uses 3D UNIX!                 |     Lorem ipsum dolor sit amet.
                                       |     Dolor sit amet lorem ipsum!!!
3. Wayne's World                       |
   Party movie deluxe!                 |  6. This Is The Last
                                       |     Now we're not balanced!
                                       |     Pretty messed up.

以上内容应该让您了解今天的样子。我目前正在通过获取电影列表并将其分成两半然后依次渲染每一半并将两半彼此相邻的方式来实现这一目标。

但是有一个问题！想象一下，右栏中的电影都有比左栏更长的描述。然后高度平衡就会消失！

那么有没有非JavaScript的方式来平衡这种事情？如果是这样，哪些浏览器支持它？

CSS：两列，平衡高度，优先选择左列

2 个答案: