I’ve been using the Webflow University, and came across two help articles on the subject of Columns. “Columns” is the easy stuff, drag n drop, etc. The second is “Use text columns in Webflow” — Is the latter now redundant? I can’t seem to find that interface anywhere, and was wanting to span Heading across columns, as discussed: “You can also set headings to span multiple columns or wrap within their column.”
So, is the first article the new Columns Tool? If so, can you still span a heading using that method? 
Welcome to the community @deebolland!
Text columns are actually a more recent addition than the column element which has been a part of the Designer since just about the beginning (as far as I recall) and more depreciated than their text counterpart. With the addition of CSS Grid and Flexbox, you can accomplish much more complex layouts that are more versatile and I’d encourage using either over the default column element.
To find the text columns option, just open up the “More type options” toggle under the Typography section in the Style panel:
If you apply columns to a parent element containing two text elements (like a heading and paragraph) you can have the heading span across the columns by selecting it, clicking the three dots next to “Columns” and choosing “Do” under the column Column Child span option:
This will stretch the element so it doesn’t flow within the normal column layout:
1 Like
Continuing the discussion from Columnar Text vs Columns:
Thanks Mike. That makes sense. So, the Element > Column is ye olde school way? Better to use the box model and grid with flex? I can imagine that being the case, but as a new user, I saw this nice, flashy video tutorial, and assumed “this is the way”. Thanks for pointing out where to look: I must have looked there countless times, but could not see the wood for the trees.
Could I ask, then, about the more complex, but better, approach to text columns? I come from a print background, and I’m trying to approach this aspect of typesetting from that angle. Or, should I start a new thread, seeing as this is essentially, and assuredly an answered topic, from my perspective.
Glad I could help out! Also, no need for a separate thread, I feel like it’s still pretty relevant to your initial question and I’m happy to give my two cents.
Think of both types of columns as being suited for different uses, so unless you feel like manually splitting the copy (which isn’t ideal for dynamic CMS data, for example) I’d recommend using the text columns for any typesetting. Splitting up other types of content (like text next to an image) is best suited for flexbox/grid, but you can always use the two together to create more interesting layout options.
1 Like
Continuing the discussion from Columnar Text vs Columns:
Thanks again, Mike. Apologies for the delay: had to prepare a couple of visuals, created in Adobe InDesign. Both visuals are self explanatory: no span and yes span of a header. In InDesign (or similar) you can create balanced columns with a consistent baseline, without the use of the awful (actual) baseline. Type in this example is set at:
Body (Paragraph) 12pt
16pt lead
16p after
Header 24pt
32pt lead
16p after
This is possible, by allocating the “leading” method to the text containers, so the text inside always obeys the lead of the type.
With HTML (as opposed to print) I could never get a consistent baseline, with a non-span header. I guess the standard bale out from this situation is the span of the header across columns, to avoid the ugly baseline difference between header and body? Or is the non-span solution viable now, with flex and grid? In other words, can you set the containers of the type (columns) to obey their type line spacing (or lead)? If so, what value would one use? Unitless comes to mind, but similar outcomes result in Webflow, using pixel as lead units, too. Any ideas? Seems to me, the text box value inheriting somehow the same value of the text itself? I think I just blew a brain cylinder.
I’m by no means an expert when it comes to print typesetting, and web typography is a pretty complex subject, but ultimately you can achieve a similar effect by establishing proper vertical rhythm:
There are some great resources available like this or this that allow you to generate your own CSS rules for proper vertical rhythm, which can either be included in your project with custom code or by manually styling your text elements within the Style panel.
I don’t have too much experience other than some research and a bit of testing, but it should be fairly straightforward since it uses relative units. If it’s something you want to explore on your project and you run into any issues, feel free to reach out!
Can you elaborate? The question is quite vague
Have you tried format painter or alt + H + O + I (autofit 192.168.100.1 192.168.1.1 jpg to pdf columns)?
Continuing the discussion from Columnar Text vs Columns:
Hi again Mike
I’ve studied all the articles you supplied on the Vertical Rhythm subject. It’s all pretty close to what I was already testing with, but after a good full day of trials in Webflow, it seems no-one has really cracked the Holy Grail of Headings sitting adjacent to columns, and it’s probably why most other tutorials I’ve come across, use the span of the headline. Nothing really wrong with that: it’s a good compromise. I’m not going to re-invent the wheel, or even try. If I use a tool like Webflow, I’ll limit myself to what it can do, out of the box. I’ve included an illustration of the headline baseline lining up with the body text baseline (as per the print universe), across columns, for those folk out there who think it’s feasible in HTML. Thanks again, Mike. It was worth exploring. Would be nice to see Webflow do a series of videos on columnar text layouts, as this whole experiment gets a whole lot worse, when you try introducing images in to columns, emulating a magazine print layout. Yikes!
1 Like
No problem, and thanks for the update!
As you figured out, setting type based on what is the base line in the print world doesn’t really work out as nicely on the web because of how text sits within it’s line-height. Obviously there are some workarounds, most of them being less than ideal, but I appreciate the desire to use only what’s available in Webflow’s current tools.
That said, I believe there are some CSS rules coming down the pipeline to address this more natively although I can’t seem find the article I read recently about it, and unfortunately a quick search doesn’t yield any related information. If it comes up I’ll be sure to send it your way.
Continuing the discussion from Columnar Text vs Columns
Hi Mike
Well, I see it as the print world having the nicer outcome. To have misaligned elements in print, that drift from the baseline, means not following the laws of pre-computer hot lead typesetting (leading). Essentially impossible to deviate. The “drift” I’m seeing in HTML looks ugly to me. 