平常專案中經常會遇到有左側導航選單的高度不固定，需要與母元素或右側元素等高的情況，以前就自以為是的使用js來設定，不僅不方便還會出現各種bug，後來就突然想到了乙個好方法。有可能這方法已經被其他人用爛了，但還是在這裡獻醜分享出來，希望和大家一起**學習。
先請看示例：
以前可能會這樣寫，將母元素背景設定為淡灰色，子元素左右浮動，右側元素背景為白色。但這樣因為左右元素沒有間距，在某些瀏覽器下縮放可能會換行。
我這裡的方法是將左側元素left絕對定位（position:absolute）,母元素parent相對定位（position:relative），並為母元素設定padding-left:left的寬度，然後讓left高度height:100%,這樣左側元素left的高度就會跟著母元素變化。最好再為右側元素或母元素設定乙個min-height，因為左側絕對定位不會撐開母元素。
當然這方法也是有缺點的，如果左側元素高度會發生很大變化，比如有可展開隱藏的二級選單，就可能超出母元素顯示。希望大家視情況選擇合適方法，也希望能提出改進建議。
css 左側跟隨右側高度自適應
給父元素設定position relative，左邊的子元素設定position absulote，且左邊元素的高度為100 css 如下 position left right parent 這種方法的原理其實是把子元素的實際高度撐開的很多，父元素overflow hidden起到乙個遮罩作用，來...
css布局之高度自適應
方法一 利用絕對定位 乙個元素是絕對定位時，如果沒有給它設定高度或寬度，則它的的高度和寬度是由它的top right bottom left屬性決定的。13 高度自適應，就是同時設定了top和bottom的值。方法二 利用padding實現 1 給父元素留padding top，然後用相對定位，把b...
css布局之左側固定右側自適應布局
1.固定高度 左側固定 右側欄自適應寬度 title style type text css mainbody leftcol rightcol style head body divid mainbody divid leftcol div divid rightcol div div body ...