Texte réactif envelopper une image

Question

J'ai besoin de texte pour entourer une image (200px par 200px) jusqu'à ce qu'une partie du texte enveloppé sur le côté devienne trop étroite, à quel point je veux que la zone de texte passe sous l'image.

Ce que je veux dire:

when the screen is wide

when the screen is more narrow
C'est là que je veux l'emballage pour arrêter. Je ne veux pas le texte d'envelopper d'une manière qui affiche des piles maigres de texte comme celui-ci:

Lorem
Ipsum
est
simplement
factice
texte
du
impression
et bla bla Lorem Ipsum est simplement factice texte de l'impression et

S'il vous plaît aidez-moi :(

Answer 1

article { 
 
    margin: 20px; 
 
    font-family: verdana, sans serif; 
 
    font-size: 16px; 
 
} 
 
p { 
 
    margin-top: 20px; 
 
} 
 
.example-container { 
 
    clear: both; 
 
    margin-top: 40px; 
 
} 
 
.caption { 
 
    font-style: italic; 
 
    color: BlueViolet; 
 
    margin-top: 40px; 
 
} 
 
.caption-subhead { 
 
    font-style: normal; 
 
    font-weight: bold; 
 
} 
 
.image-example { 
 
    float: left; 
 
    background-color: #555555; 
 
    width: 300px; 
 
    height: 80px; 
 
    text-align:center; 
 
    color: #FFFFFF; 
 
    padding-top: 60px; 
 
    margin: 5px 20px 10px 0; 
 
} 
 
.hyphenate { 
 
    -webkit-hyphens: auto; 
 
    -moz-hyphens: auto; 
 
    -ms-hyphens: auto; 
 
    hyphens: auto; 
 
}

<article lang="en"> 
 
    
 

 
<div class="example-container"> 
 
    
 
    <div class="image-example">Image Example</div> 
 
    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p> 
 
</div> 
 

 
    
 
</article>