Bug: Drawer component 2 scrollbars because of height: 100vh on iPhone (not tested on android)

[arminYer]

I used the daisyui site as an example:

https://user-images.githubusercontent.com/80158077/162779203-ea7a6633-249f-4877-8813-097e869f29b8.mp4

[saadeghi]

This is fixed on Safari 15.4 which supports the new CSS svh unit.
The new svh unit fits the height of screen considering the dynamic parts of the browser (address bar for example)
If the browser doesn't support the new svh unit, drawer height falls back to 100vh which is 100% of vertical height but ignores the dynamic sections of the browser.

Unfortunately there's no solution for previous versions of iOS Safari (unless we calculate the height using JS)

[robrecord]

I don't believe this is fixed.

On macOS Safari (Release 144 (Safari 15.4, WebKit 17614.1.9.7), svh causes the same problem. Please try dvh instead?

https://user-images.githubusercontent.com/38916/168030020-bd268861-1d01-4305-9991-d5ca6364558d.mov

[saadeghi]

@robrecord That's strange because I don't have this problem on Safari 15.5. I will try replacing it with dvh today.

[greendesertsnow]

I have this problem on Brave Browser / Windows

[saadeghi]

Can you please upgrade to version 2.15.0 and see if the issue is fixed or not?
@robrecord @greendesertsnow @arminYer

[Phosphorus-M]

Currently, the same problem using Vivaldi (browser based on Chromium). In previous versions it didn't work too so I'm not sure how it worked before.

[kkharji]

Okay I give up. I spent way too much time trying to get it fixed.

[saadeghi]

My friends, not all browsers support the new CSS units svh, dvh, etc. Currently Safari and Firefox are supported but not Chrome and Edge (source)

This will cause dynamic parts of the browser (like the addressbar) that will change sizes, not get calculated in browser height. As far as I know, this will still be a problem on Android Chrome and older iPhones Safari. However if you have this issue on a Desktop browser, that's probably a different problem. Please open a new issue for that and provide a code example so I can help.

Let me know if you have any questions.