如何使用引导隐藏iframe的水平滚动条？ 在这里输入代码 加载…

我在我的网站上嵌入了一个谷歌表单，我使用的是Bootstrap4，在一个更大的屏幕上，它看起来很好，没有滚动条，什么都没有。在较小的屏幕上，有一个水平和垂直的滚动条。我有两个问题。我如何摆脱滚动条

垂直滚动条不是优先考虑的，我可以学会适应它。如果我删除了所有引导类，我可以通过设置高度来摆脱它，但是它没有响应，并且在某些屏幕尺寸上可能有空白，而在其他尺寸上则缺少部分表单

水平条是一个优先事项，它困扰着我，在较大的屏幕上它很好，在较小的屏幕上，它超过了屏幕宽度，有三个点，菜单总是在屏幕外的右边，但是表单上的所有内容都在屏幕上，所以即使我可以以某种方式隐藏溢出，也很好。如果我删除引导类并使用css设置max-width:100vw和overflow-x:hidden，这可以工作，但与上面的问题相同，它不再响应。当我使用引导类时，这些CSS设置不起作用，所以我最好的猜测是引导中的某些内容正在覆盖这些设置

当我设置scrolling=“no”时，两个滚动条都消失了，但是表单的三分之二丢失了，即使这确实按照我的要求工作，但在HTML5中滚动属性是不推荐的，所以我可能无论如何都不应该使用它

iframe确实需要具有响应性，因为在提交后，高度要小得多，如果没有响应性屏幕，您将被困在底部的空白页面上，如果不向上滚动，人们将看不到感谢信息

非常感谢您能为我提供的任何帮助，谢谢

        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
    <link href="/common/css.v6.php" rel="stylesheet" type="text/css">
    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous" defer></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous" defer>
    </script>

enter code here     <div class="container p-0">
        <div class="row">
            <div class="col">
                <div class="embed-responsive embed-responsive-1by1">
                    <iframe src="https://docs.google.com/forms/d/e/1FAIpQLSeeAkxIKwo1Lw5SoEzNSNy6g30i-fR7hr_RZmqdmoeNECjDkw/viewform?embedded=true" class="embed-responsive-item" title="Contact Us - Howie's Bookkeeping" style="max-width:100vw;overflow-x:hidden;overflow-y:scroll">Loading…</iframe>
                </div>
            </div>
        </div>
    </div>