向左移动浮动元素在顶部，而所有以前的同级元素都向右浮动

Question

我有以下HTML结构。是否有任何 CSS 唯一的方法可以将内容 3 Div (div3( 移动到顶部？我无法更改元素的html或顺序。

我尝试使用负边距。 如果我有固定的 Div 1 和 2 高度，这有效。 Div 1 和 2 中的内容是动态的，高度无法固定。

请帮助我解决IE9及更高版本的问题。

div.container {
overflow:hidden;
background: #eee
}
div.container > div {
width: 49.5%;
float: right;
background: #ccc;
margin-top:5px;
clear:right;
padding: 10px;
box-sizing: border-box;
}
div.container > .div3 {
float:left;
clear: none;
clear:left;
}

<div class="container">
<div class="div1"> Dynamic <br>Content 1</div>
<div class="div2">Content <br> 2</div>
<div class="div3">Content 3</div>
<div class="div4">Content 4</div>
<div class="div4">Content 5</div>
</div>

Answer 1

更新：根据您的评论，我认为这应该可以解决问题。 您可以在div3 上使用position:absolute;，在容器div 上使用position:relative。

div.container {
overflow:hidden;
background: #eee;
position:relative;
}
div.container > div {
width: 49.5%;
float: right;
background: #ccc;
margin-top:5px;
clear:right;
padding: 10px;
box-sizing: border-box;
}
div.container > .div3 {
float:left;
position:absolute;
}

<div class="container">
<div class="div1"> Dynamic <br>Content 1</div>
<div class="div2">Content <br> 2</div>
<div class="div3">Content 3</div>
<div class="div4">Content 4</div>
<div class="div4">Content 5</div>
</div>