私はdivで区切られた2つのサイドページを実行しようとしています。1つはコンテンツで、もう1つはサイドバーです。
サイドバーは左側に配置する必要があります。
そして、これが私が現在それを行うために使用しているコードです:
#SideBar
{
float: left;
width: 300px;
background-color: #727272;
height: 100%;
position: absolute;
top: 0px;
bottom: 0px;
left: 0px;
}
#Content
{
float: left;
right: 0px;
top: 0px;
bottom: 0px;
position: absolute;
left: 300px;
padding: 3px;
font-size:12px;
overflow:auto;
}
初めては正常に動作しているように見えますが、ブラウザを復元(サイズ変更)しようとすると壊れます。
サイドバーに配置されたDivがオーバーフローしています。はい、サイドバーの内側の要素について話しています。
サイドバーが左側に固定されていないのはなぜですか?
前もって感謝します。
編集:
私のhtmlは:
<div id="SideBar">
Sidebar content goes here
</div>
<div id="Content">
Main content goes here
</div>