2010-10-05 62 views
0

我想在左邊放置一些文字邊框,並在同一行右邊放置一些文字邊框。我該怎麼做?CSS定位幫助

謝謝。

謝謝大家的回答,我工作得很好。再次感謝。

+1

如果其中一個答案爲你工作,這是禮貌「接受「它通過點擊旁邊的勾號按鈕:-) – Spudley 2010-10-06 12:10:10

回答

3
<div> 
    <div style="float:left;border:solid 1px black;"> 
    Some text 
    </div> 
    <div style="border:solid 1px black;"> 
    More text 
    </div> 
</div> 

這是你在找什麼?

+0

謝謝....它的工作。 – 2010-10-06 12:07:42

0

有幾種選擇,根據不同的情況:

  • 使用浮動:float: left左邊的容器上,float: right右容器上
  • 使他們行內元素或內聯塊 - display: inline-block可以創造奇蹟
  • 使用絕對定位,結合leftright性質
0

也許是這樣的:

<html><head> 
<style type="text/css"> 

#content{ 
    border:2px solid #999; 
    padding:10px; 
} 
.titlebox{ 
    float:left; 
    padding:0 5px; 
    margin:-20px 0 0 30px; 
    background:#fff; 
} 
</style></head><body> 

<div id="content"> 
    <div class="titlebox">Title</div> 
    <p>Lorem ipsum dolor sit amet consectetuer venenatis vitae Nulla fringilla consequat. Wisi magnis volutpat auctor Nulla Vivamus id In elit dictumst mollis. Curabitur auctor consectetuer dui interdum neque Curabitur vel auctor tellus netus. Sed tincidunt condimentum semper Vestibulum sed tellus ridiculus elit In dictum. Turpis lacus pellentesque In ac volutpat mi non nibh vitae laoreet. Elit.</p> 
</div> 
</body></html> 

可以是你的好開始。該示例僅通過利用負頂部邊距在左側放置文本,但應該很容易對其進行自定義! (從here拍攝)

你可以分爲兩個部分.titlebox由具有右對齊子(text-align: right)在其上有正確的標題