search

adamwulf / Columnizer-jQuery-Plugin

The Columnizer jQuery Plugin will automatically layout your content in newspaper column format. You can specify either column width or a static number of columns. And, of course, it’s easy to use!
http://welcome.totheinter.net/columnizer-jquery-plugin/
Other
760 stars 147 forks source link

Allow columnbreak to work with native CSS3 columns API #60

Open waiting-for-dev opened 12 years ago

waiting-for-dev commented 12 years ago

I don't know if it's possible or not.

Currently, the most part of modern browsers (I think, except webkit) supports de CSS3 columns feature except for the column-break-before and alike properties.

It would be great to be able to use native CSS3 columns and at the same time Columnizer column break feature, extended to allow before and after options. Currently, it is a fact of all or nothing. If you want to rely on Columnizer to break columns you have as well to go on with the rest.

Thanks a lot!

adamwulf commented 12 years ago

Not sure that I could get it to work /with/ CSS3. the only possibility i believe would be for me to read the CSS3 properties and completely take over column rendering from the browser. there's not a good way for me to allow the browser to render columns except for column breaks.

unfortunately its all or nothing :/

epicdaze commented 12 years ago

At least for the particular case of column-break-inside: avoid, I'm sidestepping the problem by using jQuery instead of CSS3. I generate a wrapping DIV around the group of elements I don't want to wrap and apply the class .dontsplit:

For example, in my particular case, I use this (customize it for your own needs):

/* group headings with first following item */
$('section > div > h3').each(function(){
    $(this).next('dl').andSelf().wrapAll('<div class="dontsplit"/>');
});
/* create columns */
$('section').columnize({columns:2});