Im not sure how exactly to call my problem, hence the cryptic title.

The situation I have is the following:

```
<div class="widget full">foobar</div>
<div class="widget half">left</div>
<div class="widget half">right</div>
<div class="widget half">left</div>
<div class="widget full">foobar</div>
<div class="widget full">foobar</div>
<div class="widget half">left</div>
<div class="widget half">right</div>

```

I let these widgets float left and right, based on the odd or even css:

```
#main > div.widget.full { display: block; width: 100%; }
#main > div.widget.half { display: block; width: 49%; }
#main > div.widget.half:nth-child(2n+1) { float: right; }

```

Works like a charm on the first 2 'half' ones, but the 2 after that get screwed over by the 3rd 'half'. The last 2 are in 'reversed order'. What I need is some sort of reset or other solution that will put the divs in the right place, regardless of what is between them.

If there is no CSS answer for this I can fix it generating them in PHP, but CSS has my preference since its a style-issue.

Thanks in advance