nth-child di colonne CSS3

Question

Sto usando CSS3 columns ma voglio controllare ciascuna colonna singolarmente per impostare sfondi diversi su colonne pari/dispari.

Voglio che il risultato da come mostrato in questa immagine:

il contenuto HTML:

<div id="content"> 
    content body text content body text content body text 
    content body text content body text content body text content body text 
    content body text content body text content body text content body text 
    content body text content body text content body text content body text 
    content body text content body text content body text content body text 
    content body text content body text content body text content body text 
    content body text content body text content body text content body text 
</div> 

Css:

#content { 
    column-gap:25px; 
    column-count:3; 
} 

voglio usare qualcosa del tipo:

column:nth-child(even) 
{ 
    background:#0000ff; 
} 

Posso usare CSS3 :nth-child proprietà? o posso usare qualsiasi soluzione javascript per ottenere il selettore di ogni singola colonna?

Si prega di dare le vostre soluzioni suggerite.

Grazie in anticipo

Answer 1

Aggiungi background blocchi posizionati assoluti per lo styling ..

Qualcosa di simile a questo:

#bg1 { 
    position: absolute; 
    width:30%; 
    height:100%; 
    background-color:green; 
    z-index:-1; 
} 

Fiddle