The formal description found online:
Reference content
This value causes an element to produce a block box model, which itself acts as a single inline box model (inline box) flow, similar to an substituted element. The display value of the Inline-block element forms a block box model, and itself forms an inline substituted element.
PS: Unfortunately, IE does not support, FF also does not support. hoho~
IE solution: Triggers the layout of IE so that the element has similar line-block characteristics.
FF Solution: Use Moz exclusive attribute: Display::-moz-inline-box;
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < HTML xmlns= "http://www.w3.org/1999/xhtml" lang= "ZH-CN" xml:lang= "ZH-CN" > <pead> <meta http-equiv= " Content-type "content=" text/html; Charset=utf-8 "/> <meta name=" keywords "content=" prcss,xhtml,html,css,js,book, personal homepage, boredom, nerves, laziness "/> <meta nam E= "description" content= "Prcss's personal homepage, boring, nervous, lazy ..."/> <meta name= "Author" content= "prcss,qq:50198763"/> &L T;meta name= "Copyright" content= "This page belongs to prcss all. All Rights Reserved "the use of/> <title>line-block: Minimum width setting-www.jb51.net</title> <style type=" Text/css "&G t;<!--. box {display:inline; zoom:1; min-width:400px; width:auto!important; width:400px; clear:right; border:1px Sol ID #000; Background: #ccc; } Html:lang (ZH-CN). box {Display:-moz-inline-box;} . box img {display:block; width:100px height:300px; background: #c00;} --></style> </pead><body> <p class= "box" > </p> <p> Test </p> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
box {display:inline; zoom:1; min-width:400px; width:auto!important; width:400px; clear:right; border:1px solid #000; ba Ckground: #ccc; }
Html:lang (ZH-CN). box {Display:-moz-inline-box}/* MOZ-FF *
