html - パーセンテージベースの要素が重ならないようにするにはどうすればよいですか?

Question

CSS を含む HTML ページがあり、幅、高さなどのパーセンテージ測定を使用しています。

問題は、ウィンドウを小さくしてサイズを変更すると、ある時点で HTML 要素がオーバーラップすることです。

これは私がやりたいことです：

要素には、あるポイントまでのパーセンテージ測定値が含まれている必要があります。ただし、そのポイントを超えると、要素は固定され、サイズが縮小することはありません。

どうすればこれを達成できますか？

Answer 1

を探していmin-widthます。

div{
    width:50%;       /* Your dynamic width */
    min-width:300px; /* The narrowest the element can be */
}

http://jsfiddle.net/ejbSd/

Answer 2

要素に最小幅を使用するか、css3 メディア クエリを使用してさまざまな幅のレイアウトを変更できます。

Answer 3

これに対処するには、メディアクエリを使用するだけでよいようです。この場合、次のように入力します。

@media (max-width: [width you want things to turn fixed]) {
  element selector {
    position: fixed;
    width: [fixedWidth];
  }
}

実際に が必要ない場合は、わざわざクエリを作成するのではなく、他の人が提案して使用しているものfixedを実行する必要があります。min-width