Need to remove bottom padding

I am using flowbite react sidebar component there appears a div in dev console with py-4 I cant override it in code I have marked where the div appears in between those tags
No description
No description
15 Replies
Jochem
Jochem7mo ago
target the div with a selector with higher specificity and add padding-bottom: 0;
bOOmer
bOOmer7mo ago
Ohh so I cant mentions className ="" anywhere and do it directly
Jochem
Jochem7mo ago
"do it directly" is targeting it with a css selector, really if the component doesn't expose that div's class list, you'd have to edit the component or change the list using javascript after, but both aren't great options
bOOmer
bOOmer7mo ago
I meant in the HTML part ....but the div itself it not accessible its in between Sidebar and Sidebar.Items
Jochem
Jochem7mo ago
that's the tradeoff with using pre-made components but plain-old vanilla CSS shouldn't have an issue overwriting that style, it's what it's made for after all
bOOmer
bOOmer7mo ago
so this editing to pre made components...shoudnt be a part of global css right ? just an extra css file along the component folder
Jochem
Jochem7mo ago
depends on how you lay out your files and how often you use this sidebar component, but both could work
bOOmer
bOOmer7mo ago
thanks
Chris Bolson
Chris Bolson7mo ago
Adding [&>nav>div]:pb-0 in the sidebar might resolve this: <div id="sidebar-logo" className="flex [&_nav>div]:pb-0">
bOOmer
bOOmer7mo ago
WTF is this magic 🧐 I spent 2 hours ... scratching my head
Chris Bolson
Chris Bolson7mo ago
in Tailwind you can add "proper" CSS within square brackets, the only thing to bear in mind is that you can't have spaces so, if you need a space, you have to use an underscore. That would be the same as:
#sidebar-logo nav > div{
padding-bottom: 0;
}
#sidebar-logo nav > div{
padding-bottom: 0;
}
bOOmer
bOOmer7mo ago
Hi In the sidebar items ...how does one control the colors or sizes of icon and Like i dont get it theres no documentation around in flowbite react for customisation , how do i know what properties or classes any component supports
Chris Bolson
Chris Bolson7mo ago
I have no idea about flowbite and very little about React. Sorry.
Jochem
Jochem7mo ago
in very general terms, and I realize it's a PITA, you can just open the source for the component and read it
Want results from more Discord servers?
Add your server