画像回り込みをした時に一部スマホで解除がきかずレイアウトが崩れる

途中送信してしまいましたすみません。

上記のリンク先の２番目のように画像回り込みをした時に一部スマホで解除がきかずレイアウトが崩れてしまいます。

メディアクエリなどcssに関しての知識がなくどこをカスタマイズしたらいいのかわからない状態です。モバイルでの表示に関してどこを修正したらいいのでしょうか。初歩的な質問で大変申し訳ございませんがアドバイスなどいただけたら幸いです。

現在公開されているサイトのアドレスと、一部のスマホの名称を教えていただけると助かります。

解除が効かない理由としては、float:noneがその画面サイズで画像に対して入っていないのではないかと思うのですが、画像を囲む親要素、あるいは画像だけではなく、wordpress misc部分にあるalignrightなどのプロパティがその端末の画面サイズで有効になっていたりするのではないかなぁと思ったりも。

hidekichi様、わいひら様ご提案ありがとうございます。
例えばこのページ http://woman-lifeinfo.com/somethingnavy-by-arielle/
ですとiphone4,5は正常ですが6や他のモバイルだと画像の右横に数行文字が入ってしまいます。

これは単に私の画像サイズの選び方や回りこみ解除のやり方が間違っているのでしょうか？それともカスタマイズにより治すことができる問題でしょうか？

画像サイズは他の記事でもほぼ280~300くらいの横幅に指定しています。これがそもそもいけないのでしょうか。初歩的な質問で大変申し訳ありませんがご指摘いただけたら幸いです。

おそらく、親テーマstyle.cssの.alignleftが有効になっている、あるいは継承されてしまっている(※)と思います。

@media screen and (max-width: 639px){
  .article img {
    width:100%;
    height: auto;
  }
  .alignleft {
    float: none;
  }
}

こんなのを子テーマに書いてみてはどうでしょう?

意味合いとしては、639pxまでの画面サイズの時、.articleのブロック内にあるimgは幅100%で、高さは自動。
同じくして、.alignleftはフロートさせない。

本来、画面サイズの幅100%であれば文字は勝手に改行されるはずですが、例えばタブレットとかで100%にすると写真大きすぎるやんって事になるかも知れません。そんな時は、widthの横幅を指定すれば良いのです。ただし、その時にfloatがleftなりrightなり効いていると、文字が回りこんでしまうので、floatを解除させます。

※ ブレイクポイントで指定した要素のスタイル(classやid)のプロパティは、それ以外の同じセレクタ、例えばstyle.cssに書いてある内容に追記されるような感じです。
例えば、親テーマstyle.cssに

.article img {
  width: 300px;
  height: 300px;
  border: 1px solid #f00;
}

こう書いてあって、子テーマあるいはnarrow.cssに

@media screen and (max-width: 639px){
  .article img {
    width: 100%;
    height: auto;
  }
}

こう書かれていた場合、639pxまでの画面幅の端末では.article imgで確かに幅100%、高さ自動で表示されますが、元々のstyle.cssにあるborderの設定があるのでやはりボーダーが表示されてしまいます。表示されてマズイ場合は、それを打ち消すプロパティを設定する必要があります。

@media screen and (max-width: 639px){
  .article img {
    width: 100%;
    height: auto;
    border: none;
  }
}

hidekichi様わいひら様、ありがとうございます！

アドバイスに従いご指摘の点を書き加えた結果うまく表示させることができました。
本当にありがとうございました。

ワードプレスではそもそもこういった画像の回りこみはあまり推薦されないのですね。これから少し別のやり方などを模索していこうと思います。