Design Different in Builder and Front End

Hi team,

I’m working on the contact section on the page “untitled”. Note that I started with the themeco template “creative contact forms 1” I have 2 problems:

  1. I’ve applied custom CSS to my gravity form to make it look how I want it to. In the builder it appears correctly, but when I view on the front end, the styling is all gone. Why and how do we fix it?

  2. The row containing the contact form has the following css applied:

$el {
transform: translateY(-300px) !important;
}

This was the CSS that was already set in the provided themeco template, but I adjusted the Y value to -300 and added !important in an effort to get it to appear correctly on the front end.

It appears correctly in the builder, but when I view on the front end it does not overlap the previous section. Can you please advise how to fix this?

Thanks,
Ashley


Hi Ashley,

Thanks for reaching out.
You can set the Top value of Row to the -300px and it will work as it is.

Hope it helps.
Thanks

Thank you! That answered question 2, but you didn’t address question 1. Can you please let me know on that question too?

Hi Ashley,

It seems that the CSS is not been included, and that might be due to the sections above this one. I have created a test page and included only the form section and the CSS worked perfectly in the browser. You can find the test page in the secure note. I would suggest you check by deleting sections one by one and check if the issue is resolved. The last one you deleted before the fix is the actual issue.

Hope it helps.
Thanks

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.