两个相对的CSS容器彼此相邻

Question

我目前正在尝试开发一个网站，我需要在同一级别并排放置2个CSS容器。即他们都需要有顶级：0px;然而，乳清它们都具有相对性，第一个容器被推到第二个容器内容物完成的位置。

如何让这两个容器并排坐在一起，两者都需要相对。我一直在努力解决这个问题，谷歌搜索似乎没有提供太多帮助。

我正在使用HTML5和CSS3来构建网站。

感谢您提供的任何帮助。

修改 以下是HTML代码

<div id="feedContainer">
    Latest Tech News<br /><
    The quick brown<br/> fox jumped over the lazy<br /><br />dogs back
 </div>
 <div id="bodyIndex">
     Hi I am a body<br />and i am a new line<br/>r />and i am a <strong>another new line</strong><br />I'm another<br /><br />woo!!<br /><br />
     <font size="+24">I am a large font<br /><br />Please don't move<br />the feed container
               </font>
        </div>

以下是CSS代码

#bodyIndex
{
   position: relative;
   margin-left: 120px;
   padding-left: 15px;
   padding-top: 5px;
   width: 660px;
   /*padding-bottom: 70px;*/
   /*height: 100%;*/
   /*top: 80px;   */
   /*background-color: #c8c8c8;*/
   background-color: #fff6d1;
   /*clear: both;*/
   clear:none;
   padding-bottom: 60px;
   min-height: 100%;
   height: auto;
}


#feedContainer
{
    position:relative;
/*    top: 0px;*/
    top: 0px;
    bottom: 0;
    width: 180px;
    padding-left: 5px;
    left: 800px;
    font-size: larger;
    font-weight: bold;
    color: black;
    border-left:thin solid #e0e0e0;
    clear: none;
}

在上面的图片中，“我是一个身体”和“最新科技新闻”应该排成一行。我可以让他们排队的唯一方法是，如果我将其中一个设置为绝对但我需要两个容器都是相对的

Answer 1

尝试将容器放入<ul>并将浮动左css属性提供给未排序列表中的<li>。像这样：

<ul>
   <li style="float:left"> <!--Container here-->
   </li>
   <li style="float:left"> <!--Container here-->
   </li>
</ul>

这样容器应该并排出现

Answer 2

确保您理解该位置：相对意味着“相对于我原来的位置”而原始的盒子位置可能不是您认为的位置。