內嵌div元素對齊

-1

我遇到了正確對齊div元素的問題。內嵌div元素對齊

例如：我的網站： http://www.journeywithandrew.com/messel-pit-fossil-site-unesco-site/

你可以看到有一個介紹，然後是「關鍵事實」框。

我想要的是提出「關鍵事實」框。因此，框中的最後一行與介紹文本的最後一行內嵌。當然，對於介紹文本來說，它是圍繞「關鍵事實」框。所以我真正想要的是右下對齊該框。希望這是有道理的..

試圖在'關鍵事實'框上做出負頂部邊距，但不會取代介紹文本。只是讓它覆蓋文字。

有什麼建議嗎？

來源

2014-06-12 Scientized

我認爲這個FIDDLE將幫助你找出把盒子放在哪裏。

（試行錯）

根據頁面包裝或屏幕的寬度，文本位置可能會改變。

CSS

.page-wrap { 
    width: 600px; 
} 
.spacerdiv { 
    height: 100px; 
} 
.stuff { 
    float: right; 
    width: 100px; 
    height: 100px; 
    line-height: 100px; 
    text-align: center; 
    border: 1px solid black; 
    border-radius: 5px; 
}

來源

2014-06-12 02:02:21 TimSPQR

您有以下一般格式爲：

<div class="entry-content"> 
    <p>Some words</p> 
    <div class="keyfactsunescowrapper"> 
      <!-- This block --> 
    </div> 
</div>

段落標記，是一個塊級元素，推動下一個內容到新行。浮法尊重這一點，並不會自動提升。

但是，您可以在關鍵事實塊之前的段落（S）和問題解決。既然它是正確的，它允許段落在同一行上流動，並且該段落不會將它推到新行，因爲段落在它之後。

<div class="entry-content"> 
    <div class="keyfactsunescowrapper"> 
      <!-- This block --> 
    </div> 
    <p>Some words</p> 
</div>

來源

2014-06-12 02:27:10

內嵌div元素對齊

回答

相關問題