Home > database >  gradients in tailwind have a break when using h-screen
gradients in tailwind have a break when using h-screen

Time:01-03

I have the following issue on content that exceeds the height of the screen viewport.

enter image description here

As you can see, there is a hard break with the gradient, where it should be smooth.

      <body className="font-inter min-h-screen h-screen dark:bg-dark-background dark:text-dark-text-primary bg-gradient-to-br from-gray-800 to-gray-900">
        <Main />
        <NextScript />
      </body>

How should I set my CSS so this does not happen?

CodePudding user response:

The problem was in global.css

Had to remove

html {
  @apply h-full;
}
body {
  @apply h-full;
}
  • Related