ワードプレス、スマホで見たときに画像の回り込みを解除する方法は？

写真や絵を記事で使い文字は回り込みをしたときはパソコンで見ていると良いけど、スマートフォンで見ると文字が回り込みをして「見づらい！」ってなることないですか？

こんばんゎ。
今日も寒いです。
今日はスマートフォンで見たときに画像の回り込みを解除してくれる方法のメモをします。

スマホ画像の回り込み解除

@media screen and (max-width:736px) { 
img.alignright {
	padding: 0 0 10px 0;
	margin: 0 auto;
	display: block;
	}

img.alignleft {
	padding: 0 0 10px 0;
	margin: 0 auto;
	display: block;
	}
.alignright,
.alignleft {
	float:none !important;
	}
}

このサイトで回り込み解除は上を書き込みして解除してます。
これは736px以下の画面には中の赤文字で書かれたクラスが適応されるという解釈のようです。

この .alignleft や .alignright クラスはワードプレス標準みたいなので、これを利用して回り込みを解除していると解釈。

記事を書くのにまた分からなくなってきました。
HTMLを作成してテストしようとしたらhead内に、

これが書かれていないとダメと言うのも分かりました。

あとは、

@media screen and (min-width:480px) { 
    /*　画面サイズが480pxからはここを読み込む　*/
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    /*　画面サイズが768pxから1024pxまではここを読み込む　*/
}
@media screen and (max-width:480px) {
    /*　画面サイズが480pxまではここを読み込む　*/
}

min やら max があって意味が違っていたのも、今！気が付きました。
私が今持っているiPhone6plusに合わせて横幅736px以下で画像の回り込みを解除する設定にしました。

タブレットとかちょっと無視じゃない・・？
そんな細かい芸が出来るわけがないでしょう！
と、誰に言っているんだか・・・（汗。