クリアを使用しようとすると：両方とも動作しません

Question

この件に関してかなりの質問がありますが、私の問題は解決していません。

小さな画面では、画像の周囲に浮いていないことをお勧めします。だから私はそれが動作しないこの

<div class="enimage"> 
<a href="pic/img1.jpg"><img align="left" border="0" height="192" width="264" src="pic/img2.jpg" /></a> 
</div> 
<p>Some text.</p> 

ため

@media (max-device-width: 639px), (max-width: 639px) { 
div.enimage { display: block; clear:both; } 
div.enimage img { max-width: 100%; height: auto; border: 0; display: block; clear:both; } 
} 

を持って、テキストは静止画像の右側を浮かべています！私は間違って何をしていますか？

Answer 1

align属性を使用しないでください。これは20年前から廃止されています。

イメージのCSSルールにfloat: leftを追加し、削除する場合はfloat: noneを追加します。

div.enimage img { 
    float: left; 
} 

@media (max-device-width: 639px), (max-width: 639px) { 
    div.enimage img { 
    float: none; 
    } 
} 

<div class="enimage"> 
    <a href="pic/img1.jpg"><img height="192" width="264" src="pic/img2.jpg"></a> 
</div> 
<p>Some text.</p> 

Answer 2

用表示：インラインブロック。 display：blockの代わりに;

div.enimage { 
    display: inline-block; 
    clear: both; 
}