メディアクエリ

Question

の幅計算には境界線が含まれていません。

divは100％に拡張されていますが、右側の境界線は切り捨てられています。

ここのdevのサイトを参照してください - それはここに私のイメージではクローム開発ツール使用して境界線をトグルフィード下

https://frozen-dusk-2587.herokuapp.com/

さ：

を、ここでそれがです私は国境でトグル：

Answer 1

ボックスモデルなどの基本的なことさえも、CSSルールを使用して変更できます。

は、ボックスモデルのデフォルトの動作を変更するために

https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing

を参照してください：

#at_view{ 
    box-sizing:border-box; 
} 

Answer 2

これはすべての要素のデフォルト値であるすべてのbox-sizing:content-box要素のデフォルトの動作です。 box-sizing:border-box;〜#at_viewを追加します。これにより、ブラウザは相対的な幅の計算に境界線とパディングを含めるようになります。

Answer 3

あなたが100％の幅を持つ要素を定義し、また国境場合は、境界線がありますこれは100％に追加され、これはあなたの問題を引き起こしている合計幅を100％以上にします（CSSボックスモデル：http://www.w3schools.com/css/css_boxmodel.asp）。

したがって、#at_viewの幅を100％未満に変更して、90〜95％を試してみましょう。

または非常に特異的であるように、あなたは）100％と#at_view幅を定義し、（計算値を使用して境界線を引くことができます。

#at_view { 
    width: calc(100% - 20px); 
} 

（20ピクセルを引く、20ピクセルは、によって追加された幅であるように見えますので、国境は10px→10px、右側は10px = 20px）