css - 要素が占めるスペースを非表示にせずに削除する

Question

を使用することで、要素が占めるスペースを削除せずに要素を非表示にできることを知っていvisibility: hiddenます。私がやりたいのは正反対です。要素がページ上にないかのようにページの残りの部分をレンダリングしたいのですが、要素は表示したままにしておきます。

私が尋ねている理由は、画面の左側に小さなボックスを追加したい、中央に950px幅のレイアウトがあるためです。それはちょっとこのように見えるでしょう：

現在<div>、950pxページラッパーの最上位要素としてサイドボックスを保持するがあります。これも<div>です。適用したサイドボックスposition: relativeとleft: -200px（ボックス幅）を横に移動しますが、それでもメインコンテンツが押し下げられたままになります。私は問題に正しく取り組んでいますか？サイドボックスによって残された垂直方向のスペースを削除する論理的な方法はありますか？

Answer 1

を使用するだけposition: absolute;です。要素はドキュメントフローの一部ではなくなり、最も近い非static配置の祖先を基準にして配置できます。

Answer 2

相対位置は引き続きスペースを占有します。位置を試してください：絶対; 要素をその親の完全に内側に配置しますが、すべての兄弟の上に配置します。