スマホで画像を画面幅いっぱいに表示したい

親である#mainのpaddingを特定の子imgの時だけ指定変更できないと思います。できるなら知りたいです！

特定の画像（画面幅を超える画像）

画面からはみだしてるんですね。思い当たるのが、

• 画像がはみだしている・キャプション付き画像が大きく横揺れ
• 画像のボーダー分はみ出している

見てないのでわかりませんけど、後者かもしれません！？

div, img {
	max-width: 100%;
	height: auto;
}
img {
	box-sizing: border-box;
}

なぜそうなるかと、よくある横揺れ・はみ出しは下記です
https://bibabosi-rizumu.com/simplicity-img-iframe-table-width/

違ったら、現状みせてもらえますか？

#main{padding: 10px;}がnarrow.cssで指定済み。

画面から はみでる幅の画像領域だけ、#mainのpaddingは0で表示したい

と思ったんですが、『リンク』と『もう一息追加の説明』も頂けますか？ﾓｼﾞｮﾓｼﾞｮ

お勉強させて欲しいので、お願いします！

説明が悪かったみたいで

画面幅を超える画像とは
スマホの幅より大きい画像です。例えばこのサイトのトップページにあるアイキャッチ画像（1本の木）。スマホで見ると自動で縮尺されますが、paddingは無くしたい。
てことです。

優先度の高いＣＳＳに
画像のスタイルをwidth:100%と書けば、親#mainのpaddingより優先されるのでしょうか？
paddingを-10pxにしても左寄せになるだけで、画像幅は変わりませんよね？？

div, img {
	max-width: 100%;
	height: auto;
}

こちらでSimplicityなどのテーマは対応できますが、他に子テーマ側でもしかしたら優先度の高い指定があるのかもしれません！？

スマホで見ると自動で縮尺されますが、paddingは無くしたい。

メディアクエリで対応できますよ

@media screen and (max-width: ***px) {
/*ここにスタイル*/
}

***pxは、スマホ幅を何pxにするか指定。

@media screen and (max-width: 500px) {
#main {padding: 0;}
}

500px以内？より小さいデバイスでアクセスすれば、メインの領域のpaddingは0になる。

#main .entry-content {padding: 0;}main領域内にある子要素クラス指定があるentry-content内と指定する。

これがわいひらさんが教えてくれた優先順位・詳細度など言われる部分です。

『お困りのページのリンク』を置いてもらえたら、すぐ解決するかもしれません。

書き込み先上部にある赤字一部を引用します。

不具合の出ているページのURLを掲載してください。

不具合の出ているページはありません
お困りのページもありません

単純にスマホで画像を画面横幅いっぱいに表示したい
だけです

解像度639px以下のスタイル
narrow.cssのdiv#main{padding: 10px;}もデフォルトのままです
これより優先度の高いCSSセレクタがさっぱりワカリマセンねー

さっぱりわかりませんねー

？？？そうですか

でしたら
https://wp-simplicity.com/
こちらではmobile.cssに書かれているので、そこに下記を追記すれば反映します

div#main{
  padding:0;
}

スマホビューのみpaddingをなくしたいだけでしたら、このコードでいけますよ

「.imgs-wrap」とは
Simplicityで使われているセレクタなのでしょうか？

調べてみたのですが全くわかりません
画像もビクともしません