What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Header is cut off in mobile version

    Asked by Clare  on May 06, 2016 at 11:28 AM

    I've built a site using Weebly but now when I open it on a mobile part of the header is cut off.  I can't work out which code I need to alter to fix this. 

    This is the code in the 'main_style.css' for 'mobile devices' 

    @media (max-width: 767px) {

      

      /* General */

     

      

      body {

      font-size: 12px;

      }

     

      .wsite-multicol-col {

        max-width: 100% !important;

        display: block;

        width: auto !important;

        margin: 0 auto 1em !important;

      }

      

      /* Layouts */

      

      #banner-inner {

        width: 100%;

      }

      

      #banner-inner td {

        display: block;

        text-align: left;

      }

     

    .wsite-logo {

    font-size: 1.75em;

    }

     

    .wsite-logo, .wsite-logo * {

        display: block;

        max-width: 100%;

     margin: 0 !important;

    }

     

      #banner h2 {

        font-size: 3em !important;

      }

      

      #banner h2 span, #banner h2 font, #banner p span, #banner p font {

        font-size: inherit !important;

        line-height: inherit !important;

      }

      

      .splash-content {

        width: 100%;

        padding: 0;

      }

      

      .landing-page #banner {

        height: 26em;

     

      }

      

      .tall-header-page #banner {

        height: 20em;

      }

      

      .short-header-page #banner {

      height: 14em;

      }

      

      .short-header-page #banner-inner h2 .wsite-headline, .no-header-page #banner-inner h2 .wsite-headline {

        padding-left: 0 !important;

        background: none !important;

      }

      

      .short-header-page #banner-inner h2, .no-header-page #banner-inner h2, .short-header-page .wsite-logo, .no-header-page .wsite-logo {

        float: none !important;

      }

     

    /* Gallery */

      

      .imageGallery .halfwidth-mobile {

        width: 50% !important;

      }

      

    .galleryCaptionHolder {

    display: none !important;

    }

      /* Cart */

      

     

      #wsite-mini-cart {

        padding: 2em 2em 0em !important;

      }

     

      /* Store */

      

      .wsite-com-sidebar, .wsite-com-content-with-sidebar {

        display: block;

        width: 100%;

        margin: 0 auto;

        padding: 0;

        text-align: center;

      }  

      

      .wsite-com-sidebar {

        margin-bottom: 2em;

      }

     

      #wsite-com-store .wsite-com-category-subcategory-group .wsite-com-column, #wsite-com-store .wsite-com-category-product-featured-group .wsite-com-column,  #wsite-com-store .wsite-com-category-product-group .wsite-com-column {

        width: 50% !important;

      }

     

      #wsite-com-product-images {

        width: 100% !important;

      }

      

      #wsite-com-product-images, #wsite-com-product-images .wsite-com-column {

        float: none !important;

      }

      

      #wsite-com-product-info {

        margin-left: 0 !important;

        margin-top: 25px;

      }

      

      /* Blog */

      

      #blogTable > tbody > tr > td {

        display: block !important;

        width: 100% !important;

        margin: 0 auto;

        padding: 0 !important;

      }

      .blog-body {

        float: none !important;

      }

      .blog-header {

        text-align: left;

      }

      .blog-sidebar .column-blog {

        width: 100%;

        float: none;

        padding-top: 3em;

        border-top: 1px solid $btnHLnormal;

      }

      

      #commentPostDiv .commentInput, #commentPostDiv .commentTextarea {

        padding: 0 12px !important;

      }

      

     

    Thanks for any help! 

    Page URL:
    www.oceanviewboattest.weebly.com

    Mobile mobile version cut in
  • Profile Image

    Answered by victor on May 06, 2016 at 11:52 AM

    Sorry for the inconvenience. Could you please provide the direct URL of where you have embedded your form. We will be glad to help resolve the issue.