当前位置: 动力学知识库 > 问答 > 编程问答 >

css - CSS3 MultiColumn element with multiple rows

问题描述:

If you have a lot of text and use a css multicolumn element, the columns tend to get longer than the screen which is really annoying to read. In the specification there is some talk of rows but I'm not sure how to make use of that. It is also said that in case of paged media the overflowing columns can be displayed on the next page. However, I'm not sure how I would use this for a div in the browser.

What I'm interested in is to have a fixed height and width for the columns. Then, as many as possible should be displayed per row.

Ok let me add some code:

suppose I have a simple div with

div {

-webkit-column-width: 400px;

-moz-column-width: 400px;

column-width: 400px;

width: 820px;

}

Now if there is a lot of text such as in this example http://jsfiddle.net/5jqwd/6/ this is not nice to read anymore. It would be far better readable if there was some kind of page like structure as shown here http://jsfiddle.net/5jqwd/4/. Of course I don't want to manually tell the browser where each page starts or ends.

分享给朋友:
您可能感兴趣的文章:
随机阅读: