The label wrapping would be normal in this situation with lengthy labels. When using the left-algined or right-aligned label settings for the form, the labels are constrained to 32% width so all of the fields will be justified on the left. When you have lengthy field labels, the default “top label” option is usually the best choice.
That said, since your page doesn’t have a sidebar, you can increase the maximum width value of the containing div, thus increasing the size allowed for the labels.
Try adding this to the end of your theme stylesheet.
Also, you mentioned differences in the form preview and the live site. The form preview just uses the default Gravity Forms styles to and primarily exists so you can test the functionality of the form before adding it to your site. It doesn’t include any of your theme styles so it’s not intended to be an exact visual representation of how the form will look in your page.
Honestly, with all the differences in theme markup and CSS, there’s no way to accurately do this for every theme out there. The form will naturally inherit some properties from the theme so once you’ve added it, you can always tweak things via your custom.css file and get it just the way you want it.
I hope that helps out.
Posted 9 years ago on Thursday July 8, 2010 | Permalink