css - 将纸张对话框设置为适合窗口后将其大小调整为默认值

Question

我正在使用 paper-dialog 的响应式设计。通过 min-width: 320px 我能够使用以下样式使其全屏显示:

paper-dialog {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  padding: 0;
  margin: 0;
}

它会相应地滚动。但是当屏幕变大时，我想将它设置为默认样式。我试过这种风格:

paper-dialog {
    position: fixed;
    top: 5%;
    left: 5%;
    bottom: 5%;
    right: 5%;
    padding-bottom: 10%;
    margin: 0;
    height: 100%;
  }

但这是我能得到的最接近我想要的地方。

对话框在底部被裁剪。我只想将其恢复为默认样式。抱歉，我不太擅长 CSS。感谢任何可以提供帮助的人:)

Answer 1

我所做的是将 min-width: 321px 反转为 max-width: 321px 并尝试在屏幕只有 320px 时将 paper-dialog 设置为全屏。感谢您花时间阅读 :D