php - placeholder in input feild in wordpress is not working in mobile device -
i creating website in wordpress using jupiter theme placeholder in contact form not displaying in mobile phone , working in desktop. example placeholder in phone number in mobile displays , phone number not seen.
.mk-contact-form-wrapper.outline-style.contact-light .mk-textarea::- webkit-input-placeholder, .mk-contact-form-wrapper.outline-style.contact-light .text-input::- webkit-input-placeholder { color: rgba(255, 255, 255, .7) } .mk-contact-form-wrapper.outline-style.contact-light .mk-textarea:- ms-input-placeholder, .mk-contact-form-wrapper.outline-style.contact-light .text- input:- ms-input-placeholder { color: rgba(255, 255, 255, .7) } .mk-contact-form-wrapper.outline-style.contact-light .mk-textarea:- moz-placeholder, .mk-contact-form-wrapper.outline-style.contact-light .text- input:- moz-placeholder { color: rgba(255, 255, 255, .7) } .mk-contact-form-wrapper.outline-style.contact-light .mk-textarea:focus, .mk-contact-form-wrapper.outline-style.contact-light .text- input:focus { background-color: rgba(255, 255, 255, .1); color: #fff } .mk-contact-form-wrapper.outline-style.contact-light .mk-textarea:focus::-webkit-input-placeholder, .mk-contact-form-wrapper.outline-style.contact-light .text- input:focus::-webkit-input-placeholder { color: rgba(255, 255, 255, .4) } .mk-contact-form-wrapper.outline-style.contact-light .mk-contact-form-wrapper.outline-style.contact-light .text-input:focus:- ms-input-placeholder { color: rgba(255, 255, 255, .4) } .mk-contact-form-wrapper.outline-style.contact-light .mk-textarea:focus:-moz-placeholder, .mk-contact-form-wrapper.outline-style.contact-light .text- input:focus:-moz-placeholder { color: rgba(255, 255, 255, .4) }
and php code here
if($style == 'outline') { $output .= $fancy_title; $output .= '<div class="mk-contact-form-wrapper mk-shortcode contact- '.$skin.' outline-style '.$el_class.'">'; $output .= '<form class="mk-contact-form" method="post" novalidate="novalidate">'; $output .= '<div class="mk-form-row">'; $output .= '<input placeholder="'.__( 'your name', 'mk_framework' ).'" type="text" required="required" name="contact_name" class="text-input '.(($phone == 'true')? 'two-third' : 'half').'" value="" tabindex="'.$tabindex_1.'" />'; if($phone == 'true') { $output .= '<input placeholder="'.__( 'your phone number', 'mk_framework' ).'" type="text" name="contact_phone" class="text-input two-third" value="" tabindex="'.$tabindex_2.'" />'; } $output .= '<input placeholder="'.__( 'your email', 'mk_framework' ).'" type="email" required="required" name="contact_email" class="text-input '.(($phone == 'true')? 'two-third' : 'half').'" value="" tabindex="'.$tabindex_3.'" />'; $output .= '</div>'; $output .= '<div class="mk-form-row"><textarea required="required" placeholder="'.__( 'your message', 'mk_framework' ).'" name="contact_content" class="mk-textarea" tabindex="'.$tabindex_4.'"> </textarea></div>'; $output .= '<div class="mk-form-row"><textarea placeholder="'.__( 'insert area of interest', 'mk_framework' ).'" name="contact_content1" class="mk-textarea custom" tabindex="'.$tabindex_6.'"></textarea></div>';
placeholder attribute support pc based browser not mobile try use techniques placeholder.
Comments
Post a Comment