Overriding Typeform CSS | Community
Skip to main content
Question

Overriding Typeform CSS


Forum|alt.badge.img

Whilst using our Typeform on mobile (at https://ukmoneyman.com/book-now-referral/?id=test@test.com) the button sticks to the bottom of the page. If I reduce the height of the embed, the button goes up and sits nicely under the text, however, on the first question the form is affected by this change and shrinks down.

So, I am asking whether I can move this button up without affecting the Typeform size. I have tried to use “transform: translate(0px, -280px)” to move this up but the Typeform style keeps overriding it. Is there anyway that we can move this button up? 

Thank you!

 

 

10 replies

Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 15035 replies
  • March 20, 2023

Hi @UKMoneymanLTD While we don’t have a native option that would allow you to do this, @mathio may possibly have some workarounds for you! Or @jeremielp ← they’ve always got some tricks up their sleeves!


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • March 20, 2023

Hello @UKMoneymanLTD 

it is not advised to use custom CSS to modify your typeform. It might break the functionality and even if it does not, it is not guaranteed to work in future.

This is intentionally by design and you can not change it. 

Desktop Mobile

 

 

 

 


Forum|alt.badge.img

As you can see by me screenshot, mine does not appear like it does in yours, meaning that the user has to scroll down, is there a way that I can force it to go full screen like your screen shot?


Forum|alt.badge.img

I think I have a workaround. Rather than using welcome screen, I have used a statement, renamed the button to "Start" and removed quotation marks and it seems to work :)


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 15035 replies
  • March 21, 2023

Hi @UKMoneymanLTD Could you share the URL where you have the form embedded? 


Forum|alt.badge.img

Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 15035 replies
  • March 22, 2023

Hi @UKMoneymanLTD Thanks! It looks like you’re using the full page code, but you should instead be using the standard embed. Could you give that a try and let us know if that helps? 


Grace
Community Team
Forum|alt.badge.img+5
  • Community Advocate
  • 2711 replies
  • March 29, 2023

Hey @UKMoneymanLTD did you manage to try Liz’s suggestion here? Let us know how it’s going 😊


Forum|alt.badge.img

Hi, it is working slightly but was working better as a statement, so we are just going to run with that :) thanks for the help anyways!

 

 


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 15035 replies
  • March 29, 2023

Let us know if we can help with anything else, @UKMoneymanLTD !


Reply