我的HTML/CSS 代码如下: .frame { border-radius: 15px; background-color: #b3b6b9; height: 400px; padding: 50px 10px 75px 10px; } .screen { border-radius: 10px; background-color: #ffffff; height: -webkit-fill-available; padding: 20px 15px 150px 15px; } .circle { border: 1px...
首先，避免使用前缀属性，因为它们只被特定的浏览器支持。-webkit-fill-available是WebKit浏览器对stretch、...
实现的功能是在CSS 中自动添加width / height 属性。
background-position: center; height: fill-available; /* stylelint-disable value-no-vendor-prefix */ height: -webkit-fill-available; height: -moz-available; /* stylelint-enable value-no-vendor-prefix */ transition: background-image 1.25s linear; ...
我试图通过将div的高度设置为-web-fill-available来实现这一点,但是div的高度太大了,并且它延伸到窗口底部以下。所以你不能使用滚动条滚动到文本的底部。它似乎使用了整个窗口的高度,而不是减去搜索框的高度。 我也尝试过使用flex,但也不能理解这种方法。 我怎么才能让它工作呢?
fix: -webkit-fill-available overriding height Browse files - remove unnecessary build step - add demo site for testing main v0.5.1 … v0.2.2 mvllow committed Dec 29, 2021 1 parent 99295f3 commit 866a784 Showing 22 changed files with 1,312 additions and 155 deletions. Whitespace ...
body{min-height:100vh;/* mobile viewport bug fix */min-height:-webkit-fill-available;}html{height:-webkit-fill-available;} This code was updated to include thehtmlselector after I was told thatChrome is updating the behaviorto match Firefox’s implementation. ...
请告诉我与此问题相关的任何信息。 谢谢你。 ` #main { min-height: 100vh; } /* iOS only */ @supports (-webkit-touch-callout: none) { #main { min-height: -webkit-fill-available; } } `css ios web safari value-of-css-property ...
body{min-height:100vh;min-height:-webkit-fill-available;}html{height:-webkit-fill-available;} The above was updated to make sure thehtmlelement was being used, aswe were toldChrome is updating the behavior to match Firefox’s implementation. ...
I have a css3 boxflex layout in webkit, but for some reason, #main (the purple one) isn't filling 100% of the screen like the css is telling it to: http://jsfiddle.net/qxxZv/ How do I get it to fill the whole height available? This is just a basic layout with header, ...