'tailwind: responsive design not working on grid

I wanted to turn grid-cols-4 to grid-cols-1 on smaller screen sizes. The below code does not solve the issue. It stays at grid-cols-1 itself:

      <div className="grid grid-cols-1 md:grid-cols-4 gap-4 ">
        <div className='images col-span-2'>...</div>
        <div className='info col-span-2'>...</div>
      </div>



Solution 1:[1]

Solved it by uninstalling tailwind and installing it again but this time did this:

npx tailwindcss -i ./src/input.css -o ./src/output.css --full

Added the --full option to it.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 linux2