css - div left 和 div right 不在容器中并排 float

Question

这里是 jsFiddle

#wrapper {
    margin:1px;
    height:auto;
    width:auto;
    float:left;
    clear:both
}
#wrapperR {
    margin:1px;
    height:auto;
    width:auto;
    float:right;
    clear:both;
}

在我的页面中它看起来像这样

  L
   R

但我希望它看起来像 LR 我希望 及其所有内容在 保持正确并肩并肩。

我添加了 clear:both;对于两个 div，我什至创建了一个 .clear{clear:both;} 并调整了宽度、填充和边距，但我仍然不能并排 float 它们。

我想知道我在看什么。

谢谢!

Answer 1

从以下位置删除 clear:both:

#wrapperR {
margin: 1px;
height: auto;
width: auto;
float: right;
clear: both; /* REMOVE THIS LINE*/
}

jsFiddle example

这里的 clear:both 规则意味着这个元素将被放置在它之前的任何 float 元素的下面。