• Resolved 01labs

    (@01labs)


    Hi Edgar,

    My form fields are not viewing at the same width. In my form I had to make the “Name” fields a 6 column width in order to get the “First” and “Last” name fields to sit on a single line. (When it was set to 12 column, it put both fields on separate lines at 12 columns each).
    However, after doing this, the total width is not the same as a single 12 column width line. If you notice in my form, the total width of the “Name” fields is shorter than the address “Street Address” field. The only difference is that the “Name” field is set at 6 columns width and the “Street Address” is set at 12 columns width. I thought that by setting the name fields at 6 columns each it would equal 12 columns total?

    Same problem with the “City” + “Zip” total width shorter than the “Street Address”.

    Is there some custom CSS you can provide to remedy the problem?

    Thank you!
    Mark

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author EDGARROJAS

    (@edgarrojas)

    Hello!

    Looks like your theme is conflicting with the plugin styles. Please try adding this to the css of your form:

    .bootstrap-wrapper .col-lg-1,.bootstrap-wrapper .col-lg-10,.bootstrap-wrapper .col-lg-11,.bootstrap-wrapper .col-lg-12,.bootstrap-wrapper .col-lg-2,.bootstrap-wrapper .col-lg-3,.bootstrap-wrapper .col-lg-4,.bootstrap-wrapper .col-lg-5,.bootstrap-wrapper .col-lg-6,.bootstrap-wrapper .col-lg-7,.bootstrap-wrapper .col-lg-8,.bootstrap-wrapper .col-lg-9,.bootstrap-wrapper .col-md-1,.bootstrap-wrapper .col-md-10,.bootstrap-wrapper .col-md-11,.bootstrap-wrapper .col-md-12,.bootstrap-wrapper .col-md-2,.bootstrap-wrapper .col-md-3,.bootstrap-wrapper .col-md-4,.bootstrap-wrapper .col-md-5,.bootstrap-wrapper .col-md-6,.bootstrap-wrapper .col-md-7,.bootstrap-wrapper .col-md-8,.bootstrap-wrapper .col-md-9,.bootstrap-wrapper .col-sm-1,.bootstrap-wrapper .col-sm-10,.bootstrap-wrapper .col-sm-11,.bootstrap-wrapper .col-sm-12,.bootstrap-wrapper .col-sm-2,.bootstrap-wrapper .col-sm-3,.bootstrap-wrapper .col-sm-4,.bootstrap-wrapper .col-sm-5,.bootstrap-wrapper .col-sm-6,.bootstrap-wrapper .col-sm-7,.bootstrap-wrapper .col-sm-8,.bootstrap-wrapper .col-sm-9,.bootstrap-wrapper .col-xs-1,.bootstrap-wrapper .col-xs-10,.bootstrap-wrapper .col-xs-11,.bootstrap-wrapper .col-xs-12,.bootstrap-wrapper .col-xs-2,.bootstrap-wrapper .col-xs-3,.bootstrap-wrapper .col-xs-4,.bootstrap-wrapper .col-xs-5,.bootstrap-wrapper .col-xs-6,.bootstrap-wrapper .col-xs-7,.bootstrap-wrapper .col-xs-8,.bootstrap-wrapper .col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 0 !important;
    padding-left: 0 !important;
    }

    i think that will fix it =).

    Regards!

    Thread Starter 01labs

    (@01labs)

    Thanks Edgar! It fixed the field width. However, it maximized the width space in the container. Is there a way to add a 20px padding left and right? I tried to add it but it affected some fields by pushing them inward past the 12 column fields. Then I tried to set a margin, but that pushed it outside the container.

    Sorry!

    • This reply was modified 7 years, 4 months ago by 01labs.
    Plugin Author EDGARROJAS

    (@edgarrojas)

    Sure, something like this?

    .rednaoFormContainer {
    padding: 0 20px 0 20px;
    }

    Thread Starter 01labs

    (@01labs)

    Perfect! Thank you!!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Field column width inconsistent’ is closed to new replies.