css - Web ページの競合をセクション/列に分割する

Question

外部 CSS シートを使用するサンプル ページを作成しています。ページのコンテンツを 3 つの異なるセクション (左、中央、右) に分割しようとしています。真ん中と右側にあります。列を次のように使用してみました：

.column {

        /* setting the number of columns to 3 */
        -webkit-column-count: 3; 
        -moz-column-count: 3; 
        -o-column-count: 3;
        column-count: 3;
        /* setting the space between columns to 30px */
        -webkit-column-gap: 52px;
        -moz-column-gap: 30px; 
        -o-column-gap: 30px; 
        column-gap: 30px;

}

しかし、これはコンテンツを3つの異なる列に分割するだけで、あるセクション/列のテキストが別のセクション/列に重なってしまいます。

他に影響を与えずにそれぞれのフォーマットを作成できるように、これを行う方法はありますか?