css - ラジオボタンセットが変わらない

Question

Chrome では、マウスまたはキーボードを使用しても状態が変わらない 2 つのラジオ ボタンのセットに少し問題があります。

これはHTMLです：

<!-- Dialog Boxes -->
    <section class="add-movie-dialog">
        <section class="dialog-box">
            <form class="dialog-container" name="add-movie-dialog-form" action="">
                <header class="dialog-title">
                    New movie.
                </header>
                <section class="dialog-content">
                    <p>
                        Add a new movie to the library:
                    </p>
                    <input type="radio" name="add_option" value="file" checked="checked" />by selecting a file...
                    <br />
                    <input type="radio" name="add_option" value="empty" /> empty entry...
                </section>
            </form>
        </section>
    </section>

これはCSSです（実際にはそれほどではありませんが、十分に近いです）：

    .add-movie-dialog {
    #mixin.flex-container( column, center, stretch, nowrap );
    background: fadeout( @black, 50% );
    height: 100%;
    left: 0px;
    line-height: 1.5em;
    position: fixed;
    top: 0px;
    width: 100%;
    .dialog-box {
        #mixin.flex-container( column, flex-start, center, nowrap );
        background: @darkgrey;
        padding: 2em;
        .dialog-container {
            width: 66%;
            .dialog-title{
                #mixin.font( x-large );
                padding-bottom: 1em;
            }
            .dialog-content{
                letter-spacing: 0.1em;
                padding-bottom: 1em;
                & > p {
                    padding-bottom: 10px;
                }
            }
        }
    }
}

これはそのイメージです：

サンプル画像

現在、強調表示されたラジオ ボタンは、マウスまたはキーボードを使用して「空のエントリ」に変更されません。なぜなら、コードは有効であり、機能するはずです (ここに何かが欠けていない限り)。

---

解決済み

使用していたJSファイルに古いjavascriptを残していたようで、選択を台無しにしましたが、問題のあるJSブロックを削除した後、それは元に戻りました.