スマホで、コンテンツ内の画像を画面幅いっぱいに広げたい

画像の左右のちょっとした隙間を無くす、ということですかね。
これが簡単なようで、できないのです。
（正確にいうとできるのですが、他の部分でデザイン崩れが生じる可能性大です）
安全にやるとすれば、下記のようなCSSをstyle.cssに追加しておいて、
横いっぱいに表示させたい画像（imgタグ）を囲むpタグに「img-full」というクラス名を追加するという方法ですかね。

.entry-content .img-full {
    margin-left: -15px;
    margin-right: -15px;
}
@media screen and (min-width: 500px) {
  .entry-content .img-full {
    margin-left: -25px;
    margin-right: -25px;
  }
}
@media screen and (min-width: 768px) {
  .entry-content .img-full {
    margin-left: 0;
    margin-right: 0;
  }
}

分かりづらいと思うのであまりおすすめしません。