Small, Large, and Dynamic viewport units

[MarcoMicale]

Replace h-screen (height: 100vh;) with h-screen (height: 100svh;)
Replace min-h-screen (min-height: 100vh;) with min-h-screen (min-height: 100svh;)
Replace max-h-screen (max-height: 100vh;) with max-h-screen (max-height: 100svh;)

[longmauriceproj]

or just add new classes to support dvh, lvh, and svh. I just wanted to bump this discussion, though I don't know how much visibility these get

[djfarly]

See: #11317

As an alternative:

const {
  height,
  minHeight,
  maxHeight
} = require('tailwindcss/defaultTheme');

/** @type {import('tailwindcss').Config} */
module.exports = {
  theme: {
    extend: {
      height: {
        ...height,
        screen: '100svh'
      },
      minHeight: {
        ...minHeight,
        screen: '100svh'
      },
      maxHeight: {
        ...maxHeight,
        screen: '100svh'
      },
    },
  },
};