PricingBlog

Zoom in on form

  • samuelt_19895-1282760144786296832

    Samuel T

    1 year ago

    How do I prevent zooming in on forms when focused?
  • andreasmoller-1282769122987610196

    Andreas Møller

    1 year ago

    CMD/CTRL + scroll
  • Or pinch on a trackpad
  • samuelt_19895-1282771651720908943

    Samuel T

    1 year ago

    thanks @Andreas Møller but I meant for the user - I have a login page and on mobile, when I tap to enter details everything zooms in. I have a code snippet to prevent that in Webflow but don't know how to do it here
  • Sorry I should have been clearer earlier
  • andreasmoller-1282773870020923404

    Andreas Møller

    1 year ago

    Ah you mean on mobile.
    Are you sure you want to prevent that? It does it for a reason
  • You can set a meta tag (in the page) or make sure the font size of the input is at least 16px
  • samuelt_19895-1282774984925777930

    Samuel T

    1 year ago

    @Andreas Møller Thank you
  • It worked, one last thing sir
    How about preventing the whitespace at the bottom of the page when scroll ends
  • andreasmoller-1282775326124015661

    Andreas Møller

    1 year ago

    Uh that depends on why it is there. It could be extra padding or margin on an element
  • samuelt_19895-1282828595794018395

    Samuel T

    1 year ago

    https://cont-peia_affiliates.toddle.site/
    I don't really have any extra padding or margin - to be fair it does happen on most sites
  • 1282828654681788527-IMG_1972B8E93767-1.jpeg
  • When you get to the end an still "force scroll"
  • lucasg-1282832478955900949

    Lucas G

    1 year ago

    This doesn’t appear for me on mobile
  • samuelt_19895-1282833767475576852

    Samuel T

    1 year ago

    I see, it appears when you get to the end of the page and still force swipe up
  • lucasg-1282834984985428001

    Lucas G

    1 year ago

    That's a 'rubber band' effect though no? It comes back to normal
  • samuelt_19895-1282836396096356372

    Samuel T

    1 year ago

    It does - its just a bit annoying haha
    I add css to prevent that in webflow, just cant do it here
  • lucasg-1282836962138525801

    Lucas G

    1 year ago

    Sure you can, CSS works anywhere
  • samuelt_19895-1282837476586684429

    Samuel T

    1 year ago

    I added it to the page but no effect
  • lucasg-1282837660116975617

    Lucas G

    1 year ago

    What is the code
  • samuelt_19895-1282837764307554325

    Samuel T

    1 year ago

    1282837764018012263-Screenshot_2024-09-10_at_00.59.07.png
  • <style>
    body {
    overscroll-behavior: none;
    }
    </style>
  • lucasg-1282837877641711616

    Lucas G

    1 year ago

    Remove the <style> tags
  • samuelt_19895-1282838138020036740

    Samuel T

    1 year ago

    I did - still
  • 1282838209822199809-Screenshot_2024-09-10_at_01.00.55.png
  • lucasg-1282841185362382919

    Lucas G

    1 year ago

    I believe you have to set it on the document. So html { overscroll-behavior: none }
  • samuelt_19895-1282841359815802944

    Samuel T

    1 year ago

    Yes I just tried

    html, body {
    overscroll-behavior: none !important;
    }

    and it worked, thanks
  • About adding the custom css and stuff, is there a way to expand so that if its a long block of code you can see and edit it easily?
  • samuelt_19895-1282844592345190400

    Samuel T

    1 year ago

    Do units like SVH and DVH work in toddle?
  • samuelt_19895-1282846010934296687

    Samuel T

    1 year ago

    I just realised everything works in the custom css field 🙂
  • lucasg-1282847053302599680

    Lucas G

    1 year ago

    It should work with just html { overscroll-behavior: none }
  • You generally want to avoid having to resort to using !important
  • Not the end of the world though
  • All CSS works in toddle
  • And most of it doesn't need to go in the header
  • samuelt_19895-1282852691894079590

    Samuel T

    1 year ago

    Yes I mean the global ones that need to go in the header
  • Tod-1282852693404028982

    Tod

    1 year ago

    Great energy @Samuel T! Your continuous contribution to the toddle Community just made you advance to Community Level 5!