我不確定我是否能夠正確說出問題的意思,但是我想通過示例簡單地了解要完成的工作。請看一下:http://codepen.io/anon/pen/XKKvBx我基本上希望它看起來像這樣:http://codepen.io/anon/pen/xOOvJB但是沒有給wqrapping div一個固定的寬度。因此,基本上,我希望包裝器采用圖像的寬度而不是過度擴(kuò)展的文本。有什么辦法嗎?還要注意,我不能使用絕對定位,因?yàn)閺臄?shù)據(jù)庫傳來的圖像和文本每次都不同。來自第一個鏈接的代碼:<div class="wrapper"> <img src="https://placekitten.com/300/300"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ornare dictum ligula quis dictum. Nam dictum, eros sit amet imperdiet aliquet, ligula nisl blandit lectus, quis malesuada nunc ipsum ac magna. Vestibulum in magna eu sem suscipit molestie. Maecenas a ligula molestie, volutpat turpis et, venenatis massa. Nam aliquam auctor lectus ac lacinia. Nam consequat lacus porta odio hendrerit mollis. Etiam at congue est, eu fermentum erat. Praesent vestibulum malesuada ante. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p></div>.wrapper { border: 1px solid red; display: inline-block;}來自第二個鏈接的代碼:<div class="wrapper"> <img src="https://placekitten.com/300/300"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ornare dictum ligula quis dictum. Nam dictum, eros sit amet imperdiet aliquet, ligula nisl blandit lectus, quis malesuada nunc ipsum ac magna. Vestibulum in magna eu sem suscipit molestie. Maecenas a ligula molestie, volutpat turpis et, venenatis massa. Nam aliquam auctor lectus ac lacinia. Nam consequat lacus porta odio hendrerit mollis. Etiam at congue est, eu fermentum erat. Praesent vestibulum malesuada ante. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p></div>.wrapper { width: 300px; border: 1px solid red;}
3 回答

肥皂起泡泡
TA貢獻(xiàn)1829條經(jīng)驗(yàn) 獲得超6個贊
無需增加寬度并仍然顯示:表格標(biāo)題在chrome和firefox中都可以正常工作,請嘗試一下,
.wrapper {
border: 1px solid red;
display: table-caption;
}
添加回答
舉報
0/150
提交
取消