How to use dvh instead of vh

[noviceGuru]

Hi!
I realized the only way to access 100vh, was h-screen class, while I wanted to add 100dvh and there was no class for that. Going into the repo to add it myself, I realized all the dynamic classes have been already defined, but not exported as classes.
I wanted to ask the reason. Is it handled by TailwindCSS itself? How is it possible to use dynamic view port?

[wongjn]

I'm not sure what you mean by the screen-full class – as far as I am aware, there is no such class in Tailwind core. To use values not in the default Tailwind configuration, you could use an arbitrary value class or add a value to the configuration for the appropriate key of the utility you'd like to use 100dvh for.

[noviceGuru]

I apologize, I meant h-screen that corresponds to 100vh. I just edited the question too.
In order to use 100dvh in my project, I ended up using the way you are suggesting.
Because dynamic view port is useful, I thought I would put a pull request together and add it to the height and width. When I went to the repo and searched for it, I found that the dynamic values, just like small and large actually existed in the codebase, for example here:

tailwindcss/stubs/config.full.js

Lines 511 to 515 in 237e715

	full: '100%',
	screen: '100vh',
	svh: '100svh',
	lvh: '100lvh',
	dvh: '100dvh',

It means that, as expected, I'm not the first one to bump into this matter.
I was wondering why wouldn't be exported even though they are there. Is there a specific reason I'm missing?

[adamwathan]

They are a very new addition to the framework and we haven’t tagged a release that includes them yet. They’ll be there by default in v3.4 👍🏻

In the mean time just do h-[100dvh] 👍🏻

[chriscodingxyz]

has vh been replaced with dvh yet? it would be great instead of having to manually do it everytime!

[adamwathan]

It's built in to the framework now yep: https://tailwindcss.com/docs/height#dynamic-viewport-height