RadioButton имеет тень в Firefox, но не в Google Chrome

Question

Вот как это выглядит в Firefox:

Как выглядит в Chrome:

Вотправила CSS, которые я использую:

<div class="checkbox-field">
    <p>Mr.</p>
    <input type="radio" name="prefix" value="mr" />

    <p>Mrs.</p>
    <input type="radio" name="prefix" value="mrs" />
</div>

.checkbox-field input {
    float: left;
    margin-right: 46px;
    border: 1px solid #A97232;
    padding: 3px;
    width: 22px;
    -webkit-box-shadow: 0 1px 3px -1px black;
    -moz-box-shadow: 0 1px 3px -1px black;
    box-shadow: 0 1px 3px -1px black;
    border-radius: 4px 4px 4px 4px;
    -moz-border-radius: 4px 4px 4px 4px;
    -webkit-border-radius: 4px 4px 4px 4px;
    color: #636363;
    behavior: url(/Public/stylesheets/PIE.htc);
    margin-top: 5px;
}

Пример JSFiddle здесь:

http://jsfiddle.net/zFNRy/

Answer 1

Пожалуйста, нормализуйте ваши стили: http://necolas.github.com/normalize.css/