Kevin Powell - Community•2y ago

scroll padding not working

hey guys, I have this absolute textarea in my chat app and it's cool in large screens, but when we go to smaller ones I get the input hiding some of the text. I tried scroll padding and it didn't work, what can I try?

4 Replies

sum117OP•2y ago

in case it's necessary, I'll leave here the utility classes i'm using (tailwind)

"input-group input-group-divider grid-cols-[1fr_auto] border-2 max-sm:border-b-0 border-r-0 border-b-0 rounded-none absolute bottom-0 items-center bg-surface-100-800-token border-l-0"

"input-group input-group-divider grid-cols-[1fr_auto] border-2 max-sm:border-b-0 border-r-0 border-b-0 rounded-none absolute bottom-0 items-center bg-surface-100-800-token border-l-0"

Okay, I got some progress doing this:

max-sm:[&:last-of-type]:pb-20

max-sm:[&:last-of-type]:pb-20

Is this the correct way to do it tho? I'd like to learn better ways, if there's any NOTE: I placed that in the cards with the texts.

phyrasaur•2y ago

the correct way is to not use absolute for the textarea at all

phyrasaur•2y ago

@sum117 https://play.tailwindcss.com/Z6r8vHx6P9

Tailwind Play

An advanced online playground for Tailwind CSS that lets you use all of Tailwind's build-time features directly in the browser.

sum117OP•2y ago

thank you delulu!

Gaming

Programming

scroll padding not working

Did you find this page helpful?