大きな画像がipadの横画面ではみ出す。　img %

レスポンシブにするために大きな画像一枚を以下のように設定したがipadの横画面でははみ出してします。

#TopContainer #block3 {
height: auto;
width: 1183px;
margin-right: auto;
margin-left: auto;
padding-top: 40px;
padding-bottom: 80px;
text-align: center;
}

#TopContainer #block3 img {max-width:100%;
height:auto;}

 

どうやらwidthをpx実数で設定したのが原因のようだ。おおきすぎるのだろうか？widthを%にしていしなおしたらレスポンシブになった。

#TopContainer #block3 {
height: auto;
width: 80%;
margin-right: auto;
margin-left: auto;
padding-top: 40px;
padding-bottom: 80px;
text-align: center;
}

#TopContainer #block3 img {max-width:100%;
height:auto;}