Not signed in (Sign In)

Vanilla 1.1.5a is a product of Lussumo. More Information: Documentation, Community Support.

Support Requests: IPAD and Form Input Width

Bottom of Page

1 to 3 of 3

  1.  
  1.  
    I am working on a new website (unpublished right now) that has a small form that will be embedded into a page using the HTML code. The form looks great within all browsers and on the iPhone, but on the iPad the form input fields are way too long. Seems a little strange when the iPhone works great, but the iPad gives me fields that run almost to the side of the page. Sorry I cannot show you as the page is not published yet.

    Any ideas??
    • CommentAuthorcbmartin
    • CommentTimeDec 14th 2011
     
    Hi QuickBiz,

    We use browser detection to apply a specific stylesheet to ipads. That's why you're seeing it differently on the ipad vs the iphone, etc.

    As for a solution, you may want to add to your own ipad specific style sheet to the custom code section of your form. You can use a style with media attribute to target a specific device and specific layout. This is example would target an ipad in landscape mode for instance:

    <style type="text/css" media="all and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)"">
    .input {
    width:YOURWIDTH;
    }
    </style>

    http://broadcast.oreilly.com/2010/04/using-css-media-queries-ipad.html

    You can also use the @media attribute in an existing custom style sheet:

    http://css-tricks.com/snippets/css/ipad-specific-css/

    Please let us know if you have more questions. Feel free to open to a support request if you'd like more specific help.

    Chase, FormAssembly.com
  3.  
    It seems if I remove the Ipad style sheet detection that everything works great. I tested IE9, Chrome, Firefox and iPad and iPhone and all work well now. I guess I can use this going forward.

    Thanks,
    BC

1 to 3 of 3

  1.