Separate text in two columns

0

I have a div that will contain two columns. As the image below:

IsthereanyCSStechniquetodothis?NotCSS3,becauseIwantittoworkinallbrowsers.

Ofcourse,Icouldcreatetwodivsthereandputfloat:leftbutitwillbeacontentonly,whentheuseristypingintheleftcolumnanditends,itgoesright.

MyHTMLlookslikethis:

<divclass="grid_480 f-left margin-top-60 margin-bottom-60"></div>

The CSS:

.grid_480{width:480}
.margin-top-60{margin-top:60px}
.margin-bottom-60{margin-bottom:60px}
.f-left{float:left}
    
asked by anonymous 07.08.2014 / 19:06

1 answer

8

No, exclusively with CSS2 does not exist, but CSS3 is not that incompatible, and you can work out an alternative layout / script for obsolete browsers with the language you know best.

With CSS3, it would be enough:

.div-em-colunas {
    -webkit-column-count:2; /* Chrome, Safari, Opera */
    -moz-column-count:2;    /* Firefox */
    column-count:2;         /* padrão */
}
    
07.08.2014 / 20:46