CODEWITHSUNDEEP
htmlcsstailwind-css
shook_one
shook_one

Reputation: 347

Tailwind responsive breakpoints don't override padding

Here's my div: <div class="h-full w-screen p-24 text-white text-shdw-light flex flex-col gap-10 lg:px-46"></div> Why doesn't it decrease the padding? lg:px-46(px-46 is a custom class) should mean that horizontal padding is 46 for resolutions above lg and when it goes below that, use p-24 right? If I replace lg:px-46 with lg:hidden it works as expected. Do breakpoints simply not work with padding?

Upvotes: 0

Views: 1318

Answers (1)

shook_one
shook_one

Reputation: 347

I figured it out. I think responsive breakpoints don't really work with custom classes like I had. Removing the custom class and adding padding onto body instead of the container itself to align everything made breakpoints work.

Upvotes: 1

Related Questions