Css 我的Rails模式窗口在小屏幕上不完全可见

我使用的是Rails 4.2.7。我在我的档案里用这个

gem 'jquery-modal-rails'

我已经将其设置为当用户单击链接时生成一个模式对话框

<%= link_to_modal 'Add Race', "#add_form", :class=>'modal_button' %>

问题是，在小屏幕（例如移动浏览器）上，我的模式窗口的部分显示在屏幕外，并且没有滚动条允许我访问这些部分。如果没有足够的空间完全显示模式窗口，是否有办法使模式窗口仅占用可用的屏幕空间

编辑：作为对给出的评论的回应，这是屏幕上添加建议样式的样子。仍然无法看到对话框或滚动

我来试一试

我创建的在线设计师有很多层叠的层，这些层叠的层缩小到零，所有层的大小都适当调整..文本和所有

基于此，我将为您推荐一些类似的代码

请注意，我只能看到截图

@media screen and (max-width: 480px) {
  #add_form {
    display: none;
    background-color: #f0f0f0;
    -moz-box-shadow: inset 0 0 10px #000000;
    -webkit-box-shadow: inset 0 0 10px #000000;
    box-shadow: inset 0 0 10px #000000;
    padding: 0 0 56.25% 0;
    overflow: hidden;
    max-width: 98%;
    height: 98%;
    top: 1%;
    left: 1%;
    font-size: 3vw;

  }
}

---

我快速地玩了一下css，也许这让你很高兴：

overflow-y:scroll；最大高度：100%；溢出-x:-moz隐藏的不可滚动谢谢，但即使添加这些样式也不允许我滚动或查看所有对话框。在我的问题中添加了一张我所看到的照片。你能为模型提供更多的HTML代码吗？例如，它是否包含在另一个元素中？
@media screen and (max-width: 480px) {
  #add_form {
    display: none;
    background-color: #f0f0f0;
    -moz-box-shadow: inset 0 0 10px #000000;
    -webkit-box-shadow: inset 0 0 10px #000000;
    box-shadow: inset 0 0 10px #000000;
    padding: 0 0 56.25% 0;
    overflow: hidden;
    max-width: 98%;
    height: 98%;
    top: 1%;
    left: 1%;
    font-size: 3vw;

  }
}