Allowing colums in text area (as in "print")

Beaver Builder
1

Hello, can’t deliver a colum-count to my text in a module…
Maybe an incompatibility between .fl-rich-text ?
I’ve created the class in my stylesheet, named “colonnage” and allow it in the <p> (in text editor)… but no change.
Thanks for your help.
Here is the page I want to have a “columned” text as I would do in Indesign for e.g.

http://www.colormyweb.fr/createur-entreprise/

In print and layout ready for magazine, we do use a chaining flux… as explained here https://helpx.adobe.com/fr/indesign/using/creating-text-text-frames.html

Thanks !!

2

Hey Frédérique,

I don’t see any class/ID placed on those rows. I did try playing around with the property and it seems chrome doesn’t accept column-count. Try placing a class of 3-col-text to the Text Editor module and use the CSS snippet below. See if it works. :slight_smile:

.3-col-text {
  -webkit-column-count: 3;
  -moz-column-count: 3;
  column-count: 3;
}

Ben

3

Thanks Ben, it doesn’t work but not our faute, as you said, not yet well supported…
damned !

I’ll get two modules and that’s be ok…
Thanks !!

4

Hey Frédérique,

It should work, if you add in the webkit and moz properties for browser support like the CSS I have above. :slight_smile:

Ben

5

arrggg… but it doesn’t. Is it better to place the class directly in the text (in the module) or in the properties of the module in the advanced field for css and ID ?

Fred

6

Hey Fred,

It should just work if you add it to the Text Editor module. I tried it that way and it works just fine. But if I were to choose, I’d rather use the 3 column layout then place the texts there. That way I get more flexibility. :slight_smile:

Ben

7

Thanks, I did it that way. It’s ok :slight_smile:
Have a nice day !

8

No worries! You as well! And have fun with BB! :slight_smile:

Ben

9

Just write a classname not starting with a number and it will work.

http://www.w3schools.com/cssref/css3_pr_column-count.asp

10

Hey Mats,

Thanks for that! I never knew that the classname wouldn’t accept such! The link below kinda explains it a bit.
http://stackoverflow.com/questions/448981/which-characters-are-valid-in-css-class-names-selectors

Ben