html - 让元素彼此相邻

Question

请看我的JSFiddle .

如您所见，我有一些 HTML 元素需要并排放置。第一个示例是我的代码，第二个是我希望它的外观，第三个是我如何修复它但不是一个选项的示例。

我不能从以下结构更改我的代码:

<div class="big">1</div>
<div class="big">2</div>
<div class="big">3</div>
<div class="big">4</div>
<div class="small">5</div>
<div class="small">6</div>
<div class="small">7</div>

我需要的是让元素正确并排放置，1 挨着 5，2 挨着 6，3 挨着 7。

我不想使用绝对定位。

如果有人能帮我解决这个问题那就太好了!

请记住，我无法更改我的 HTML，如果可能的话，这必须是 CSS 解决方案。

干杯， 卢克。

Answer 1

也更改 .big 的 CSS:

.big {
    width: 55%;
    float: left;
}

http://jsfiddle.net/9abmoasw/2/