Geek Answers Handbook

Input [type = "radio"] # amountSelectionOther: checked + label + input # amountSelectionOtherField {display: inline-block;} does not work in Safari

Work with a set of radio buttons and an HTML input text box.

<fieldset>
    <input type="radio" name="amount_choose" id="amountSelection40" value="40.00">
    <label for="amountSelection40">$40.00</label>

    <input type="radio" name="amount_choose" id="amountSelectionOther" value="Other">
    <label for="amountSelectionOther" class="amountSelectionLabelOther">Other</label>
    <input type="text" id="amountSelectionOtherField" name="amount_Other">
</fieldset>

I have CSS denoting # amountSelectionOtherField text input as display none. The idea is that I want the text box to appear only if the "Other" checkbox is selected.

input[type="radio"]#amountSelectionOther:checked+label+input#amountSelectionOtherField
    {display: inline-block;}

CSS works in Chrome, Firefox, IE on a Windows computer, and Chrome, Firefox on my MAC, but not Safari.

, Safari iOS-, , , , "" , , . 40, , ​​ .

- CSS . Safari? , JS?

+4
1

Safari ( 8.0.2), . , (~).

input#amountSelectionOtherField{display: none;}
input#amountSelectionOther:checked ~ input#amountSelectionOtherField {display: inline-block; }

: http://jsfiddle.net/ugnyaLua/14/

: https://css-tricks.com/almanac/selectors/g/general-sibling/

0

More articles:


All Articles