How do you make multiple columns on forms | Community
Skip to main content
A
Anonymous
November 18, 2013
Investigating

How do you make multiple columns on forms

  • November 18, 2013
  • 5 replies
  • 1685 views
I tried to Google it and the community page that it was linked to, went away... There must be a way to create landing pages with multiple columns and a different layout than just straight down, right?

    5 replies

    A
    Anonymous
    November 18, 2013
    A "how-to" is essentially a question. It is misplaced in "Ideas" and may receive less replies than questions posted on "Discussions".

    Multiple columns can be achieved combining form witdh, field+labels lenght and JavaScript.

    http://community.marketo.com/MarketoResource?id=kA650000000GttkCAC



    A
    Anonymous
    November 18, 2013
    This feature will be part of our FORMS 2.0 release coming soon.
      A
      Anonymous
      November 18, 2013
      Sounds like a lot of work for a pretty simple action...
      A
      Anonymous
      November 18, 2013
      And I tried and failed on the coding idea... adding the custom HTML went no where. 8(

      Width label, 200; field width, 150

      <style type='text/css'>
        form.lpeRegForm li.mktField {
          float: left;
          width:396px;
          clear: none;
          height: 26px;
        }
       
        form.lpeRegForm ul {
          width:800px;
        }
       
        #mktFrmButtons {
          clear: both;
        }
      </style>
       
      <style type="text/css">
      span.mktFormMsg
        {
          left: 0px !important;
          top: 15px !important;
        }
      </style>
       
      <script src="/js/public/jquery-latest.min.js" type="text/javascript"></script>
      <script type="text/javascript">
        var $jQ = jQuery.noConflict();
        $jQ(document).ready(function() {
          // fix the tab order
          $jQ('.mktInput :input').each(function(i) {
            if (i % 2) {
              $jQ(this).attr('tabIndex',30000+i);
            } else {
              $jQ(this).attr('tabIndex',i+1);
            }
          });
        });
      </script>
      K
      kh-lschutte
      February 7, 2020
      No text available
      Terms & ConditionsAccessibility statement

      Loading footer...