Please see attached images below. I am using the plugin “WP-Forms” to create a simple row of fields and submit button for users to subscribe to a Newsletter. When I enter the WP-Forms shortcode into a “Content Area” in X-Pro and set the column, the row, and the section all to be centered, the preview window shows correctly. When you view in the actual live browser, only the button is centered and the color changes from red to gray.
If you view the page https://dev.athletechnews.com/testing/ and refresh the browser, you can actually see for a moment the fields in the center, with a red submit button; and then, they all jump into their final (incorrect) position. It’s as if there is some CSS applied that is creating the problem, but I have applied none.
Certainly, I can apply CSS to the fields and the button separately and position them where I want, but it makes it difficult to apply media queries to optimize this on every display. If it was simply centered, it would remain centered on all devices.
Do you have any thoughts as to how I can fix this?
