漂浮在bootstrap div中的垂直文本

Question

我创建了一段代码.如果跨度mean-head的文本增加,则在span类中水平增加.我想修改它的宽度为30个字符.在该文本之后,转到新行.

示例FIEDLE

<span class="top-head"> Recommended URLs </span>
<div class="c1">   
    <div class="item">
        <div class="image"> 
            <img class="media-object" src="http://deathandtaxesmag.wpengine.netdna-cdn.com/wp-content/uploads/2014/02/Screen-Shot-2014-02-27-at-12.39.17-PM.png" >
        </div>
        <div class="descriptionContainer">
            <span class="main-head"> Mashable - Business </span>
            <span class="min-head">Title of link Title of link Title of link Title of link </span>
            <span class="subcont">
                    <span class="fa fa-retweet"> RT 100+ | </span> 
                    <span class="fa fa-twitter"> Tweet 100+</span> 
            </span>
        </div>  
    </div>  
</div>

Answer 1

为span类提供固定宽度并添加显示块

.min-head { width:150px; display:block}