Log in / Register

Forum › Feature requests

Column-span

jimbrooking
Are there any plans to implement the column-span directive (http://www.w3.org/TR/css3-multicol/#column-span)? Comments elsewhere in this forum say this is not supported, but is in in the pipeline anywhere? This would solve a bunch of problems for my application.

Thanks.
mikeday
At some point we are planning to support "column-span: all", is this what you need?
jimbrooking
Yes, column-span: all; would do nicely, thanks. In the W3 recommendation, "none" is the only other alternative, which works fine now! :)

I guess it might be too much to ask for "column-span: n;", where n<= the current column-count....

Thanks.
mikeday
Right, we'll move this up the roadmap.
jimbrooking
Thanks, Mike - REALLY appreciate it!
StoneCypher
I worked around column-span with some CSS several different ways on several different occasions. If you'll tell me what you're trying to accomplish, maybe I can help you beat the conformance clock.

John Haugeland is http://fullof.bs/

jimbrooking
Thanks, John. I'm rying to replicate a newsletter my (highly resistant to change) community publishes. A sample of the current one is at http://www.fearringtonfha.org/images/newsletters/JulAug2011%20newsletter.pdf.

My current effort is at http://www.fearringtonfha.org/newsletter/planbt.pdf. (Does not contain all the content of the original.)

What I'd like to do is have the stuff on the front page (may vary in length) be printed in a single column, and the rest, up to the Calendar, printed in two-column format. I't like to set off the different sections (front page, "What's Going On in Fearrington", "Fearrington Cares", etc.) with a full-page-wide title separating each section's content.

I was about to start a new tactic, having different <div class='twocol'>'s for the content, with an <h2>What's Going On...</h2> page-wide separating the sections.

If you think this approach will work, just point me in that direction and I'll try it out. If it won't, I'd certainly appreciate any workarounds you can offer.

The higher level overview is that we run a Joomla-based web site and would like to have our newsletter built for emailing using the Joomla component Acymailing, and be able to take the HTML from Acymailing, tweak it, and send it to the printer for the 1/3 of our population who don't have computers or computer skills and prefer paper-flavored news.

We have a couple of newsletter editors who have been doing an OK job (we're all volunteers, so don't complain too much) but would like to move toward a more electronic distribution where possible.

Thanks,
Jim
StoneCypher
You could do that, but there's also an easier way. Just wrap the differing page. (The strict way which is long-term flexible is sort of stupidly complicated, because CSS is great except in a few corner cases.)

But in your case, given the desire to keep complexity down, I'd prolly do something like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

  <head>
    <style type="text/css">
    
      p        { column-count: 2; text-align: justify; }
      onecol p { column-count: 1; }

      .splitBefore { page-break-before: always; }

    </style>
  </head>

  <body>

    <onecol>
      <h1>First page</h1>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
    </onecol>

    <h1 class="splitBefore">Other pages</h1>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>

    <h1>Long headers probably shouldn't split</h1>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>

  </body>

</html>

John Haugeland is http://fullof.bs/

web559
Just checking: Is column-span: all supported yet? I thought I had read that it was in Prince 8, but I can't seem to get it to work. Here's what my CSS/HTML look like:

.columns {
      columns: 2;
      column-gap: 1.5em;
}

.figure {
	column-span: all;
	float: prince-top-if-necessary;
        background: #ccc;
}


with HTML like this:

<div class="columns">

A bunch of content...

   <div class="figure">
      This is my figure.
   </div>

More content...

</div>


When I use code like this, the .figure div only spans all columns if it's floating (as per prince-top-if-necessary). Otherwise it's constrained to a single column.
mikeday
No, it will be supported in Prince 8.1.
web559
Awesome, thank you for the update.
Is 8.1 still a ways away or is it coming soon?
mikeday
It's only a .1 release, so it should be quicker than the last release, that's for sure. :)
Suki
Awaiting Prince 8.1 and column-span attribute..that will be an important release version for us.
mikeday
Prince 8.1 is now (finally) available, and includes support for "column-span: all". Apologies for the delay, I hope it was worth it. :)