Support » Plugin: Caldera Forms - More Than Contact Forms » Fieldtype Number: Disable the Up/Down buttons

  • Resolved rxbeat

    (@rxbeat)


    appearance: none; is not working.
    Anybody know how i can disable the up and down buttons on the right?
    I want to disable it only in one field.
    i must work with “number field” because i need the “minimum” and “maximum” selection.
    Sorry for my bad english and thanks!

Viewing 5 replies - 1 through 5 (of 5 total)
  • Nobody?

    StanfordAlan

    (@stanfordgriffith)

    Please note that most of these support forums are answered slowly because they’re free. I have nothing to do with the plugin, but this should work. If it doesn’t, you’ll need to wait for the developer to answer.

    Look at your HTML to find the ID number for that field. It will look something like fld_8220535_1.

    In your CSS use this code to get ride of all the arrows for the number fields:

    #FIELD-ID::-webkit-outer-spin-button,
    #FIELD-ID::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }
    
    #FIELD-ID {
        -moz-appearance:textfield;
    }

    In your CSS use this code to get ride of all the arrows for the number fields:

    input[type=number]::-webkit-outer-spin-button,
    input[type=number]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }
    
    input[type=number] {
        -moz-appearance:textfield;
    }

    @StanfordAlan
    THANKS ! Thats works!

    StanfordAlan

    (@stanfordgriffith)

    Glad it worked!

    BTW, there is a field ID in the backend of Caldera Forms for each field, but it doesn’t add the _1. So, that one won’t work. Weird, but true. (I have no idea if _2, etc., are ever added to it, so looking at the HTML code is the safest method.) I learned that yesterday when figuring out how to help you and wondering why my code wasn’t working.

    i had to put my field into sliderrevolution. And there i have a purple “css global” button. I put the second code in there and the buttons are gone.

    sorry for my bad englisch. Here is my full code:

    .tp-caption a {
    color:#ff7302;
    text-shadow:none;
    -webkit-transition:all 0.2s ease-out;
    -moz-transition:all 0.2s ease-out;
    -o-transition:all 0.2s ease-out;
    -ms-transition:all 0.2s ease-out;
    }

    .tp-caption a:hover {
    color:#ffa902;
    }
    input[type=number]::-webkit-outer-spin-button,
    input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
    }

    input[type=number] {
    -moz-appearance:textfield;
    }

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Fieldtype Number: Disable the Up/Down buttons’ is closed to new replies.