CSS跨度浮動

Question

在下面的HTML中，我想在同一行上顯示跨度和h2，兩者均向左浮動。跨度中有較少的文本，但H2有更多，所以應該繼續到下一行，但目前看來，我做錯了什麼：

HTML：

<div> 
    <span>hello</span> 
    <h2>This should start after the span, and continue to next line.</h2> 
</div> 

CSS：

div{ 
    border: 1px solid red; 
    width: 150px; 
    overflow: hidden; 
} 

span{ 
    display: inline-block; 
    float: left; 
    border:1px solid green; 
} 

h2{ 
    display: inline-block; 
    float: left; 
} 

演示： http://jsfiddle.net/ZnSBJ/

Answer 1

從h2刪除float:left，改變inline-block to inline

h2{ 
    display: inline; 
} 

DEMO

---

如果你想H2表現得像框，然後指定寬度

h2{ 
    display: inline-block; width:100px 
} 

DEMO 2