画像が画面幅いっぱいに広がらないのを直したい

Question

開発者ツールを使って要素にカーソルを合わせた状態です。
画像にpaddingもmarginもついていないのですが、どういうことかお分かりでしょうか。

 <section class="bg">
      <div class="inner">
        <img src="img/part0_img01.png">
      </div>
    </section>

.bg {
  background: url(img/part1_img02.jpg) left/100% 100% no-repeat;
  position: relative;

  width: 100%;
  height: 500px;
  position: relative
}

.bg .inner {

  background-color: transparent;
  background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #000), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #000), color-stop(.75, #000), color-stop(.75, transparent), to(transparent));
  -webkit-background-size: 4px 4px;
  width: 100%;
  height: 100%
}

.bg img {
  width: 60%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

Comments

[kei344]

https://teratail.com/questions/235178 この質問と内容が同じです。teratailは質問内容の編集ができるので、変更がある場合は新しい質問をするのではなく編集してください。また、こちらの質問を削除されるよう運営に連絡されることをお勧めします。 https://teratail.com/help#delete-question https://teratail.com/contact/input

Answer 1

reset.cssはどのようなものを使用していますか？？
環境をコピーしてみまして、似たような感じになったのですが
下記を追記したら修正できました。

body {
    margin: 0;
}