CSS屬性探秘系列(五)：min-width
我要評論一、基本含義
min-width 屬性為給定元素設置最小寬度。它可以阻止 width 屬性的應用值小于 min-width 的值。min-width 的值會同時覆蓋 max-width 和 width。
二、可取值
常用百分比、固定px|em|ex等，其他屬性值如max-content,min-content兼容性很不好。
div{min-width:100em;}
div{min-width:800px;}
……
三、兼容性
IE7+，常用現(xiàn)代瀏覽器,關于IE6的兼容處理，建議使用js控制,IE6將逐漸退出前端舞臺。
四、應用
常用在百分比寬度布局中，縮放瀏覽器窗口，以免窗口很小時影響頁面的布局 美觀。
相關屬性：max-width,min-height,max-height
我們在做布局設計時，經常有這樣的布局，兩邊或者一邊是導航類工具欄 ，中間是內容區(qū)域。
但我們希望中間的內區(qū)域能夠自動適應，隨著不同的分辨率和瀏覽器的大小自動適應高度和寬度，以獲得較好的顯示效果。
我們假設中間的內容區(qū)域是個div，如果我們不明確設置它樣式的width屬性，它是可以自動適應的，按說這滿足了要求。
但是當瀏覽器的寬度過小時，小到已經不能整齊的顯示我們的內容，頁面的顯示就會混亂不堪。
這時我們可以為該內容div設置一個min-width,比如在css中：
#content{
min-width:600px;
}
這個屬性的功能就像它的名字一樣簡單：最小寬度。該div還是自動適應寬度，但它多了個條件，當它自適應的寬度小于設置的最小寬度時，就會把該div的寬度設置為最小寬度，不再自動適應。
這個屬性在firefox和ie7中是可以使用的，但在ie6中不支持，我們可以用下面這段代碼代替：
#content{
_width: expression(((document.compatMode && document.compatMode=='CSS1Compat')? document.documentElement.clientWidth : document.body.clientWidth) < 700? '600px' : 'auto');
}
前面的這段：
((document.compatMode && document.compatMode=='CSS1Compat')? document.documentElement.clientWidth : document.body.clientWidth) < 700
只是個判定條件，判定頁面body的寬度，這里的是，如果頁面body的寬度小于700（這個要根據具體的頁面來指定），就把content的寬度指定為600，否則就讓它自適應寬度。
其實min-height也同理！
相關文章
IE6不支持CSS中的min-width/height屬性問題的解決方法
min-width與min-height在css中是相當好用的語法，可以讓HTML元素最少仍保持一定的寬和高，而需要時仍隨著元素的內容增加寬和高。2009-09-08- 首先我們知道這個效果應該是一個老話題了。 今天整理文件的時候，發(fā)現(xiàn)自己以前的一些布局的解決方法躺在文件夾里很長時間了，翻翻老底吧 需要說明的是有幸也見到過CSSPLAY2008-10-17
IE6支持max-width/height與min-width/height(完美解決方案)
IE6支持最大寬度,IE6支持最小寬度以及讓IE6支持min-width同時又支持max-width解決方案，代碼很簡潔功能很實用，有需求的朋友可以參考下哈，希望可以幫助到你2013-03-22min-height和min-width兩個最小高度和最小寬度兼容多瀏覽器版本
min-height和min-width這兩個最小高度和最小寬度的容器屬性相信大家并不陌生,本文介紹了min-height和min-width兼容多瀏覽器版本做法，有需要的同學可看看,先說說min-height2012-12-18- 如果一個元素沒有設置最小寬度(min-width)，這時當瀏覽器縮小到一定程度時，元素中的布局可能會發(fā)生變化，如果想要保持不變可以給元素（如div)設置最小寬度屬性，有此需求2013-08-16
- min-width 不兼容ie6的情況，想必大家都有遇到過吧，下面有幾種不錯的解決方法，感興趣的朋友可以參考下2013-10-16