line-block的運用最小寬度的設定_經驗交流

網路上找到的正規描述：
 引用內容
這個值導致一個元素產生一個塊狀盒模型（block box），而本身作為單一的內聯盒模型（inline box）流動排列（flow），類似一個被取代的元素。 Display值為inline-block的元素內部形成一個塊狀盒模型，而本身形成類似一個內聯的被替代元素
PS：可惜IE不支持，FF也不支持。 HOHO～ 

IE解：觸發IE的layout，從而使該元素具備類似line-block的特性。 

FF解決方案：使用moz專屬屬性：display::-moz-inline-box; 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="keywords" content="PRcss,xhtml,html,css,js,book,個人首頁,無聊,神經,懶惰"> <meta name="description" content="PRcss的個人首頁,無聊的,神經的,懶惰的..."> <meta name="Author" content="PRcss,qq:50198763"> <meta name="Copyright" content="本頁版權歸PRcss所有。All Rights Reserved"> <title>line-block的運用：最小寬度的設定 - www.jb51.net</title> <style type="text/css"><!-- .box { display:inline; zoom:1; min-width:400px; width:auto!important; width:400px; clear:right; border:1px solid #000; background:#ccc; } html:lang(zh-CN) .box { display:-moz-inline-box; } .box img { display:block; width:100px; height:300px; background:#c00; } --></style> <p class="box"> <img src="pr.jpg" alt="line-block的運用最小寬度的設定_經驗交流" ></p> <p>測試</p>
[​​Ctrl A 全選注:如需引入外部Js需刷新才能執行]

.box { display:inline; zoom:1; min-width:400px ; width:auto!important; width:400px; clear:right; border:1px solid #000; background:#ccc; }
    html:lang ; } /* moz-ff */