简体   繁体   English

有 antd 模态高度和宽度 100

[英]have antd modal height and width 100

i'm trying to figure out how to have antd modal open and have height of 100% and width of 100%, tried different ways but always getting scroll y and x, and if i put height of 100vh then using different mobile devices it still can scroll down for some reason, so my question is how to get this modal perfectly 100% height and width without any scrollings, here is my code:我试图弄清楚如何打开 antd modal 并具有 100% 的高度和 100% 的宽度,尝试了不同的方式,但总是滚动 y 和 x,如果我将高度设置为 100vh 然后使用不同的移动设备它仍然可以出于某种原因向下滚动,所以我的问题是如何在没有任何滚动的情况下使这个模式完美地达到 100% 的高度和宽度,这是我的代码:

https://codesandbox.io/s/to-customize-the-width-of-modal-antd4154-forked-kfbzj?file=/index.css https://codesandbox.io/s/to-customize-the-width-of-modal-antd4154-forked-kfbzj?file=/index.css

Please take reference from the below solution, setting below CSS worked for me: https://codesandbox.io/s/to-customize-the-width-of-modal-antd4154-forked-r0e0k?file=/index.css Please take reference from the below solution, setting below CSS worked for me: https://codesandbox.io/s/to-customize-the-width-of-modal-antd4154-forked-r0e0k?file=/index.css

.ant-modal {
  width: 100%;
  transform-origin: 85px 43px;
  overflow: hidden;
  height: -webkit-fill-available;
}

Hope this help https://codesandbox.io/s/to-customize-the-width-of-modal-antd4154-forked-mxx4j?file=/index.js希望这有助于https://codesandbox.io/s/to-customize-the-width-of-modal-antd4154-forked-mxx4j?file=/index.js

For more information:了解更多信息:

  • Change modal's width to "100vw"将模态的宽度更改为“100vw”
  • Change modal content to 100vw x 100vh with overflow auto使用溢出自动将模态内容更改为 100vw x 100vh

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM