サイドバーがボディのコンテンツを追加したときに画面から外に出る

-1

サイドバーの幅230pxを追加し、ボディ230pxに余白を追加すると、この場合はボディの幅の代わりにコンテンツが画面外に移動します。ここにシナリオがあります。サイドバーがボディのコンテンツを追加したときに画面から外に出る

<body style="margin-left:230px;"> 

<aside style="position:absolute;left:0;width:230px;">content here 
</aisde> 

<header> 
</header> 

<section> 
</section> 

<section> 
</section> 
</body>

本文の内容が縮小この場合、しかし内容は、本体から外に移動

出典

2016-10-19 user3591872

幅230pxあり、230pxを左に移動していますが、もちろん表示されません。 –

ちょうど位置を追加してください：body内の相対位置body type = "margin-left：230px; position：relative;"> –

私は体を縮小したい、いくつかのダッシュボードで起こるように、 – user3591872

こんにちはまず、地上子最初にそれを修正するために近くに試してませんでした。次に余白を使用することは、すべての場合に最適な解決策ではありません。たとえば、margin-top：20px; margin-left：20px;次のようになります。

<div id="outer"> 
<div id="inner"> 
</div> 
</div> 
<style> 
#outer { position:relative; } 
#inner { position:absolute; top:20px; left:20px; } 
</style>

、なぜあなたは絶対位置を使用しましたか？使用位置：相対

出典

2016-10-19 12:52:25

サイドバーがボディのコンテンツを追加したときに画面から外に出る

答えて

関連する問題