2010-10-05 71 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)在其上有正确的标题