Stoppen Sie Text von der Umhüllung unter Bild

Question

Ich möchte den Text von der Umhüllung unter einem Bild, stoppen, ohne irgendwelche Änderungen am HTML vorzunehmen. Kann dies ausschließlich durch CSS erfolgen? Ich weiß, dass der Text in eine div verpackt werden kann, aber ich kann das nicht auf Wordpress tun.

JSFiddle: https://jsfiddle.net/s01x1ere/

HTML

<div> 
    <p> 
    <a href="amazon.com"><img src="https://www.easycalculation.com/area/images/big-square.gif"></a> 
    Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text 
    </p> 

</div> 

CSS

div { 
    width:500px; 
} 

img { 
    float:left; 
    height:100px; 
    width:100px; 
} 

Answer 1

Wenn Sie die Höhe des div wissen, auf die Höhe margin-bottom des Bildes gesetzt minus der Höhe des Bildes.

Wenn beispielsweise die Höhe des Div 500px und die Höhe des Bildes 100px beträgt, verwenden Sie .

img { 
    float: left; 
    height: 100px; 
    width: 100px; 
    margin-bottom: 400px; 
} 

Answer 2

Sie können die obige Antwort versuchen, oder Sie können nur Ihre jsfiddle CSS mit unter CSS aktualisieren.

div { 
    width:500px; 
    position:relative; 
    padding-left:100px; 
} 

img { 
    height:100px; 
    width:100px; 
    position:absolute; 
    left:0; 
} 

Answer 3

Bitte Attache diesen Code

div { width:500px; } 
 
img { float:left; height:100px; width:100px; margin-right: 15px;} 
 
p { display: flex; }

<div> 
 
      <p> 
 
       <a href="amazon.com"><img src="https://www.easycalculation.com/area/images/big-square.gif"></a> 
 
       Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text 
 
      </p> 
 
     </div>