Wordpress和CSS3列計數

Question

我想將事件列表分成2列。當我做一個簡單的column-count時，我似乎無法讓它們在頂部對齊。我在這裏錯過了什麼？

域名here

<div id="eventssection"> 
    <img id="eventheader" src="/images/calendar.png"> 
    <div id="calendarcol"> 
    <?php echo do_shortcode('[events]'); ?> 
    </div> 
    <img id="eventmore" src="/images/moreevents.png"> 
</div> 

#calendarcol { 
-webkit-column-count: 2; 
-moz-column-count: 2; 
column-count: 2; 
-webkit-column-width: 15em; 
-moz-column-width: 15em; 
column-width: 15em; 
width: 500px; 
margin: 0 auto; 
} 

謝謝！

Answer 1

添加到您的CSS：

.event-item { 
    margin: 1em 0 !important; 
    float: left; 
    width: 250px; 
} 

的持股量將確保每個元素都被讀取其他元素的高度，然後將其放置相應。不過，您需要將每個元素的寬度設置爲容器寬度的一半，以便將文本置於每個「列」中。