Changing Css Depending On Radio:checked Property Not Working In Safari

Why is this not working in safari but works in chrome and firefox? http://jsfiddle.net/1ze83qcc/ Just click on the radio buttons and if you click login it should show the div.

Solution 1:

Ok, safari seems to have a bug regarding adjacent sibling selectors: element + element + element{}.

So I've used the sibling combinator ~

.form-list#login-drop:checked ~ .login-mobile{
    display:block;
}

and it worked.

Solution 2:

please add :nth-child(n) to label

.form-list#login-drop:checked + label:nth-child(n) + .login-mobile{
    display:block;
    }