Support » Plugin: Contact Form 7 » Adaptive Placeholder

  • Hi.
    I’m trying to put an adptive placeholder on my form.
    I’ve already made some changes on the placeholder on focus but I can’t make it overlap the answer box. Do you know how can I do this?

    This is the CSS I applyed to the placeholder:

    
    input:focus::-webkit-input-placeholder { 
        transform:translateY(-25px);
        background-color: #fff;
        color: #333;
        z-index: 2;
    }
    
    input:focus:-moz-placeholder { 
        margin-top: -57px;
        background-color: #fff;
        color: #333;  
    } /* Firefox 18- */
    
    input:focus::-moz-placeholder { 
        margin-top: -57px;
        background-color: #fff;
        color: #333;  
    } /* Firefox 19+ */
    
    input:focus:-ms-input-placeholder { 
        margin-top: -57px;
        background-color: #fff;
        color: #333;  
    } /* IE 8 and older ;) */
    

    I try to use z-index but doesn’t work.

    • This topic was modified 3 years, 7 months ago by kmasi.
Viewing 2 replies - 1 through 2 (of 2 total)
  • Please add a link to your form here so others can examine your form CSS using Dev Tools.

    Thread Starter kmasi

    (@kmasi)

    Hi,
    Sorry, I can’t do this because I’m developping the website on a private network.
    I hope someone can help me by the way. The CSS is the original one, the only change I’ve made is the one that I put above (that doesn’t work).

    Thank you.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Adaptive Placeholder’ is closed to new replies.