Two Column Form

Anonymous
Not applicable

Two Column Form

I am using this guide to convert my form to two columns. My Label width is 158 and my field width is 150, so to be safe I made the width in the HTML code 400 and the whole thing 800. The form page element is also at 800. It just simply is not converting to two columns. I have no idea what I'm doing wrong. 
I've tried it on three different landing page templates as well (two MKTO standard and one built by us). Nothing changes for any of them. 
Tags (1)
1 REPLY 1
Anonymous
Not applicable

Re: Two Column Form

This is the code I entered in the HTML box:

<style type='text/css'>
  form.lpeRegForm li.mktField {
    float: left;
    width:400px;
    clear: none;
    height: 26px;
  }
 
  form.lpeRegForm ul {
    width:800px;
  }
 
  #mktFrmButtons {
    clear: both;
  }
 
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>