0

ブラウザに関係なく発生する奇妙な問題があります (Chrome、IE、Opera Mobile Emulator を試しました)。以下に示すように、他の 2 つの div 内にネストされた div があります。これらの div はすべて 100% 幅に設定されています。最も内側の要素は、親 div の外側に移動します (ただし、「下」にとどまります)。私は何も浮かんでいないので、なぜこれをしているのかわかりません。overflow: hidden を使用しても、目に見える効果はありません。下の画像は、Google Chrome の要素の検査機能を示しています。要素とパディングがマージンを超えて伸びていることを示しています (桃色で表示)。本来あるべきように、すべてがマージン内にあることを望みます。私がやっているメディアクエリに何かあるのではないかと思い始めています。私がこれらを使用しているのは、単一のパーセンテージ幅では常に必要な正確な幅が得られるとは限らないためです。これ'

CSS

@media all and (max-width:960px)
{.container{width: 900px; } }

@media all and (max-width:1280px)
{.container{width: 1024px; }}

/*More media queries for a few other max resolutions*/

.container
{
  height: auto;
  min-width: 300px;
  max-width: 1440px;
  margin: 20px auto 0px auto;
  border: 2px solid #13192D;
}

.midwrapper
{
  padding: 0px 12px;
  margin: 12px 8px 8px 8px;
  min-height: 420px;
}

.innermost
{
  width: 100%;
  margin: 8px auto;
  padding: 8px 8px;
  border: 2px solid #13192D;
} 

余白

4

1 に答える 1

3

追加

box-sizing: border-box;
-moz-box-sizing: border-box;

.innermost
于 2013-07-17T21:19:09.827 に答える