How to use line-block and set minimum width_Experience exchange

Formal description found online:
Reference content
This value causes an element to generate a block box model (block box), and itself flows as a single inline box model (inline box), similar to A replaced element. The element whose Display value is inline-block forms a block box model internally, and itself forms like an inline replaced element
PS: Unfortunately, IE does not support it, and FF does not support it either. HOHO~

IE solution: Trigger IE's layout so that the element has line-block-like characteristics.

FF solution: use moz-specific attributes: 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,personal homepage,boring,nervous,lazy"> <meta name="description" content="PRcss's personal homepage, boring, nervous, lazy..."> <meta name="Author" content="PRcss,qq:50198763"> <meta name="Copyright" content="The copyright of this page belongs to PRcss. All Rights Reserved"> <title>Use of line-block: Minimum width setting - 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="How to use line-block and set minimum width_Experience exchange" ></p> <p>Test</p>
[Ctrl A Select all Note:If you need to introduce external Js, you need to refresh to execute]

.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 ; } /* moz-ff */