2015-11-16 49 views
0

我需要保持一組圖像的包裝。如何保持圖像的包裝?

我希望下面的CSS會做到這一點,但它仍然無法正常工作。

img { 
    display: inline; 
    vertical-align: top; 
    float: none; 
} 

這裏的演示:http://plnkr.co/edit/BwM8SuOpV49MuxXSnfP6?p=preview

有沒有辦法做到這一點?

謝謝!

- 編輯 -

這裏的一個更好的例子:http://plnkr.co/edit/WwIh6EoHcpHO18Ln06Td?p=preview

這顯示一個句子(具有呈現爲圖像中的每個字符)在錯誤的位置被包裹。是否有可能爲每個圖像設置一個css nowrap值?

回答

0

...好,想通了:解決的辦法是包裝每個字在inline-block的跨度

0

爲了讓所有「圖像字母「(如在你的例子2中),或者任何其他內聯元素停留在1行上,你可以在其父元素上設置white-space屬性。

<div class="myContainer"> 
    <img src="..."> 
    <img src="..."> 
    <img src="..."> 
</div> 

.myContainer { 
    white-space: nowrap; 
}