2014-03-12 70 views
0

我需要幫助在下面的鏈接正確調整post-title格。如果縮放結果面板使其更窄,則標題最終將與日期重疊。而不是重疊如下所示:防止div重疊

Overlapping example

我寧願標題換到一個新行來避免這個碰撞。理想情況下,我想它也使使用面積以上的日期,像這樣:

enter image description here

目前,標題將包裹一旦到達包含post div的末尾,如由標題下方的藍線。

我已經包含一個JSFiddle供您測試。

http://jsfiddle.net/sph74/

回答

1

您可以使用float: right上的日期去接近你想要什麼。沒有更多的absolute定位:

http://jsfiddle.net/sph74/1/

這是通過float: right完成(這本身上的日期)。 .post-title元素必須爲display: inlineinline-block您也可以使用float: left,但這會讓事情變得更加忙碌。

您還需要在.post-heading元素之後正確地使用clear元素,我已經通過overflow: hidden完成了老式的操作。

+0

對我有意義!它最終顯示在該行的下方,但事實證明,無論如何,我更喜歡它= P – Peaches491