Support » Plugin: Fast Secure Contact Form » Form in Mobile Browser

  • Hi –

    When I am viewing the form in a mobile browser in portrait, the contact details screen (like name, email, subject) extend off the screen. The message field is fine. I’ve tried to correct myself, but can’t seem to get the CSS reference right.

    <div style=”text-align:left;”>
    <input style=”text-align:left; margin:0; color: #696969;font-family: ‘Rufina’, serif; background-color:#eeeeee; border: 2px solid #d0d0d0;” type=”email” id=”si_contact_email1″ name=”si_contact_email” value=”” size=”40″ />
    </div>

    How do I reference si_contact_email1 via CSS and modify the size?

    http://wordpress.org/extend/plugins/si-contact-form/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Mike Challis

    (@mikechallis)

    Here is the help page for that
    http://www.fastsecurecontactform.com/tip-setting-width

    if you get stuck, let me know

    More FAQ

    FAQ – WordPress Version

    Set the width: 98%, you will probably need the name, email, subject label on one line, then the input right below it. To do that add margin: 1% & make it 98% width, float it left.

    <div class="yourclass">

    <input style="text-align:left; margin:0; color: #696969;font-family: 'Rufina', serif; background-color:#eeeeee; border: 2px solid #d0d0d0;" type="email" id="si_contact_email1" name="si_contact_email" value="" size="40" />
    </div>

    @media all and (max-width:480px){
    #contactformmaindiv label,
    labels.name {width:98%; float:left; margin:1%}
    .yourclass,
    .yourclass #si_contact_email1 {width:98%}

    }

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Form in Mobile Browser’ is closed to new replies.