wordpress letzten Blog-Beiträge Auszug Verpackung unter Bild statt rechts

Question

Ich verwende ein Wordpress-Plugin namens "Anzeige Posts Shortcode", die das folgende HTML (siehe Codepen) rendert, aber ich habe die Möglichkeit, das Layout durch die Erklärung von CSS zu ändern .

Ich habe versucht, den Link/Titel und den Ausschnitt auf der rechten Seite des Bildes durch Hinzufügen von CSS zu erhalten, aber stattdessen die zweite Zeile des Ausschnitts Wraps unter dem Bild.

.attachment-thumbnail { 
    vertical-align:top; 
    overflow:auto; 
} 

https://codepen.io/pfaustino/pen/awdXGY

Answer 1

Dies ist ein möglicher Ansatz könnte man annehmen:

.listing-item { 
    list-style:none; 
    margin-bottom:40px; 
} 

.listing-item:after{ 
    content:""; 
    clear:both; 
    display:block; 
} 

.listing-item a.image { 
    float:left; 
    margin-right:20px; 
} 

https://codepen.io/anon/pen/JJGzYx

Sie werden bemerken, dass ich eine Marge auf das Recht jedes a.image hinzugefügt und entfernte den Inline-Rand des ersten li.listing-items. Dies zusammen mit dem Rand unten ist optional.