Spazio bianco indesiderato nella formattazione del testo in due colonne

[gfrancesc0a]

Ciao webbeloz, grazie per l'aiuto!
Ho cercato di applicare il tuo esempio, ma senza effetto. Giocando un po' con la larghezza del browser e tenendo d'occhio la base del post "Prova" - laddove si manifesta il problema perché con poco testo - si vede che tra la didascalia dell'immagine di sinistra e il footer con la data c'è uno spazio abnorme. Il mio problema non è tanto lo spazio bianco dell'immagine di destra, quanto appunto quello di sinistra. Restringendo il browser, tra 840 e 875px prima e tra i 1000 e i 1080px poi, questo spazio sparisce. Quando il post invece ha molto testo, il rendering è corretto.

[webbeloz]

Ciao webbeloz, grazie per l'aiuto!
Ho cercato di applicare il tuo esempio, ma senza effetto. Giocando un po' con la larghezza del browser e tenendo d'occhio la base del post "Prova" - laddove si manifesta il problema perché con poco testo - si vede che tra la didascalia dell'immagine di sinistra e il footer con la data c'è uno spazio abnorme. Il mio problema non è tanto lo spazio bianco dell'immagine di destra, quanto appunto quello di sinistra. Restringendo il browser, tra 840 e 875px prima e tra i 1000 e i 1080px poi, questo spazio sparisce. Quando il post invece ha molto testo, il rendering è corretto.

di cosa...

ributta l'okkio nell'esempio e vedrai che poi risolvi...
Una cosa...
nel tuo HTML usi dei <div> liberi da classi / id per l'immagine.
Dagli una classe e vedrai che elimini qualsiasi spazio con un CSS mirato.

[gfrancesc0a]

webbeloz, purtroppo non riesco. Seguendo il tuo esempio (fatto benissimo), il mio div è twocolumns ed ho impostato anche le img del div con gli stessi parametri delle tue img. Però il difetto permane. Non riesco a capire dove sia l'errore.

* { 
        margin:0; 
        padding:0; 
    } 
html, body { 
        height:100%; 
    }
.twocolumns { 
        -webkit-column-count: 2; 
        -moz-column-count: 2; 
        column-count: 2; 
        position:relative; 
        top:0.1%; 
        bottom:0; 
        margin:0px 0.1% 0px !important; 
        padding:1px; 
        height:auto !important; 
        height:100%; 
        text-align:justify; 
        line-height:normal; 
    }
.twocolumns img { 
        max-width:100%; 
        margin: 1em 0 0.8em 0; 
        display:block; 
    }