How to separate wordpress content in CSS?

Question

The designer sent me this project to develop in Wordpress, was all good, until I found these columns that I could only separated using paragraphs and floats (left aligned).

Unfortunately this choice scrambles paragraphs, making reading end user as not reflected in the image.

How I can resolve this?

Please see the image for example:

enter image description here

Where Title is the_tile();, and Paragraph is <p></p> tags in HTML output (front-end)

From already thank you very much.

score 0 · Answer 1 · answered Aug 21 '13 at 21:00

0

The easiest method would be to use CSS columns (http://css-tricks.com/snippets/css/multiple-columns/), but I believe that's not support in IE9 and below.

Splitting content created in the standard WYSIWYG editor by paragraph could be challenging, as the markup it generates isn't always that clean.

answered Aug 21 '13 at 21:00

Chris Herbert

6,145
3
19
31

I tried it with CSS3, but also paragraph B is divided in 2 columns – MrRoman Aug 21 '13 at 21:05
See here: http://stackoverflow.com/questions/8506783/css3-columns-force-non-breaking-splitting-element. Maybe you can apply `inline-block` to
tags.
– Chris Herbert Aug 21 '13 at 21:06

How to separate wordpress content in CSS?

1 Answers1