IE не соблюдает порядок табуляции переключателей с атрибутами label for/id?

Может ли кто-нибудь сказать мне, почему порядок табуляции перепутан в IE 6/7/8, Chrome, Safari, когда вы нажимаете переключатели здесь? Работает в Firefox и Opera.

http://jsbin.com/inuxa5

Если вы установите первый флажок, а затем начнете использовать вкладку, вы перейдете от радиостанции 1 к флажку 3 (минуя радиостанцию ​​2).

И наоборот, если вы начнете с установки флажка 4 и перехода назад, удерживая клавишу Shift, вы перейдете от радиостанции 2 к флажку 2 (в обход радиостанции 1).

<form>

<p>
<input id="c1" type="checkbox" name="check1">
<label for="c1">checkbox 1</label>

<input id="c2" type="checkbox" name="check2">
<label for="c2">checkbox 2</label>
</p>

<p>
    <input id="r1" type="radio" name="member">
    <label for="r1">radio 1</label>

    <input id="r2" type="radio" name="member">
    <label for="r2">radio 2</label>
</p>

<p>
<input id="c3" type="checkbox" name="check3">
<label for="c3">checkbox 3</label>

<input id="c4" type="checkbox" name="check4">
<label for="c4">checkbox 4</label>
</p>

</form>