javascript - 模态 - 内容在较小的显示器上脱离模态？

Question

我下载了一个名为blockUI的免费模态插件，并将其用作我的图像上传模态。

到目前为止，我已经设计、定位了所有东西，但我有一个问题：

当我将浏览器屏幕变小，或者在 iphone 上，或者在我的另一个屏幕上时，一些内容会脱离模态

请参见此处的示例：

_{（来源：gyazo.com）}

请参阅要在您的屏幕上测试的网站的 LIVE 示例：

https://argonite.net/img/

为什么会这样？我已经设置min-width，模态应该自动调整背景大小并让内容进入。

信息：

.file_bg每个文件都将存储在 file_bg 中，它就像一个包含图像预览、进度条等的块。

#button_start- 进度条

#button_remove- #button_link - 删除/复制到剪贴板图标

CSS 文件：

http://pastebin.com/QwF4Vj3B

JS文件：

http://pastebin.com/xWt6bC32

为什么这样做？

Answer 1

对于div.blockUI blockMsg blockPage更改 min-width:35%; 到 width:35% 并添加具有固定像素值的 min-width （在您的情况下，520px 似乎很好）。这应该够了吧。对于移动设备，您可以使用 @media 查询为宽度和最小宽度应用不同的值。

div.blockUI blockMsg blockPage {
width:35%;
min-width:520px;}