overflow - 画面が小さくなるとオーバーフローする問題

Question

画面の中央に div を作成するために、次の CSS コードを使用しています。

center {
top:50%;
top: 50%;
left: 50%;
width:30em;
height:18em;
margin-top: -9em; /*set to a negative number 1/2 of your height*/
margin-left: -15em; /*set to a negative number 1/2 of your width*/
border: 1px solid #ccc;
background-color: #f3f3f3;
position:absolute;
overflow: auto;
display: block;

}

しかし、問題は、画面のサイズを変更し、画面が上記の div よりも小さくなると、div の一部が消えることです。オーバーフロー オプションを auto に設定しましたが、まだ問題に直面しています。画面がdivより小さい場合、スクロールバーが必要です。

この問題の解決にご協力ください。

Answer 1

この CSS を中央に追加します。

center{
....
    min-width: 700px;
}