固定的全高側邊欄（寬度/位置可變）

Question

Javascript是實現可變寬度/位置的全高度側邊欄的唯一方法（主要內容通過調整其自身寬度來響應）嗎？

我一直在努力實現的是從側面插入固定的全高側邊欄，並通過調整其寬度使右側的主要內容響應。 我希望僅使用CSS而不使用js或百分比寬度來實現此目的。

我知道我可以實現可變寬度的固定邊欄，但是需要js來調整主要內容區域的margin屬性。 理想情況下，我可以使用側邊欄的x位置顯示/隱藏，並且旁邊的主要內容會自動調整。

有什么想法嗎？ 提前致謝。

編輯

當前的僅CSS實現不支持全高

<!--HTML-->
<div id="container">
   <div id="sidebar">sidebar, hidden with negative margin</div><!-- end sidebar -->
   <div id="content">main content</div><!-- end content -->
</div><!-- end container -->


<!--CSS pseudo-code-->
#container {
   position:relative;
}
#sidebar {
   float:left;
   width:300px;
}
#content {}

需要JavaScript的實現

<!--HTML-->
<div id="container">
   <div id="sidebar">sidebar, hidden with width or position</div><!-- end sidebar -->
   <div id="content">main content, margin-left adjusted using js</div><!-- end content -->
</div><!-- end container -->


<!--CSS pseudo-code-->
#container {
   position:relative;
}
#sidebar {
   width:300px;
}
#content {
   margin-left: 300px;
}

Answer 1

如果您希望兩列布局都可以擴展以匹配側欄或主要內容的高度，則應使用Maxdesign布局並對其進行修改。