下面的文字用到的css样式
#container p { -webkit-column-count: 3; -webkit-column-gap: 10px; -webkit-column-rule:5px solid #333; -webkit-column-width:100px; -moz-column-count: 3; -moz-column-gap: 20px; -moz-column-rule:5px solid #333; column-count: 3; column-gap: 10px; column-rule:5px solid #333; column-width:50px; }
For over six years, CSS3 columns have been available to us; yet, strangely, they’re rarely utilized. Because they currently are only supported in Mozilla and Webkit-based browsers, this means that – again – no support in Internet Explorer. But that’s okay! The world will not end if IE users see one longer paragraph. I’ll show you how to use this helpful module in today’s video quick tip. * column-count: The desired number of columns for the element. * column-gap: The padding between each column. * column-rule: The divider for each column; can be used to specify a border. * column-width: Used to specifically state the width of each column. Please note that we must prefix each property with the -webkit or -moz, accordingly; so: -webkit-column-count. Do you use CSS columns in your projects? If no, why not?