multi-column layout

[Nico82]

Hallo zusammen,

ich habe via CSS ein Layout erstellt, welches Paragraphen automatisch in 2 Spalten überträgt ohne dass man auf ein Tabellenlayout zurückgreifen müsste. Grundsätzlich funktioniert das, ich habe jedoch das Problem, dass Chrome (mit FF funktioniert es) den 'Cut' auch innerhalb der Paragraphen durchführt. Hier ein Screenshot: http://picpaste.de/pics/monitoring-jgzoxArF.1389723798.png

Die folgenden CSS Anweisungen sollten dies ansich für alle Browser deaktivieren:

-webkit-column-break-inside: avoid;
break-inside: avoid;
-moz-column-break-inside:avoid;
-o-column-break-inside:avoid;
-ms-column-break-inside:avoid;
column-break-inside:avoid;

Leider jedoch ohne Erfolg für Chrome. Ist das Problem und bestenfalls eine Lösung hierzu bekannt?

Der zugehörige CSS-Code sieht wie folgt aus:

#columns {
-webkit-column-count: 2;
-webkit-column-gap: 1px; 
-webkit-column-rule: 0px dotted black;
-moz-column-count: 2;
-moz-column-gap: 1px;  
-moz-column-rule: 0px dotted black;
column-count: 2;
column-gap: 1px; 
column-rule: 0px dotted black;
-webkit-column-break-inside: avoid;
break-inside: avoid;
-moz-column-break-inside:avoid;
-o-column-break-inside:avoid;
-ms-column-break-inside:avoid;
column-break-inside:avoid;

-webkit-column-span: all;
-moz-column-span: all;
column-span: all;
  }

Ich vermute der komplette HTML Code ist für das Problem nicht von nöten, das ist ja kein Spezialfall sondern dürfte immer die gleiche Lösung haben.


Danke vorab!