Archived topic
Making the last list item on the sidebar widget to margin-bottom to 0
6 replies · Started by Huseyin on December 2, 2020
Hi Team,
I'm stuck with CSS with Sidebar Widgets (Recent posts & Categories). How can I get the last item on the list to have a margin-bottom of zero value (so the list looks visible nice, seems that there's extra padding on the widget)? (i have tried before writing this ticket, I think the last item is called last-child)
This is the CSS for Sidebar Widgets
.right-sidebar .widget-title {
font-weight: 700;
font-size: 22px;
margin-bottom: 9%;
text-transform: none;
}
.right-sidebar #recent-posts-2 ul li {
border-bottom: dotted 1px #C0B2CA;
margin-bottom: 5%;
padding-bottom: 5%;
font-size: 15px;
font-weight: 500;
}
.right-sidebar #categories-2 {
background-color: #FFF1E5;
color: #fff;
border-right: 2px solid rgba(0, 0, 0, 0.03);
border-bottom: 2px solid rgba(0, 0, 0, 0.03);
box-shadow: 0 0 10px rgba(232, 234, 237, 0.5);
}
.right-sidebar #categories-2 ul li {
font-size: 15px;
font-weight: 500;
border-bottom: dotted 1px #C0B2CA;
margin-bottom: 5%;
padding-bottom: 5%;
}
li.cat-item.cat-item-159,
li.cat-item.cat-item-158,
li.cat-item.cat-item-160{
display: none;
}
please check the screenshot
https://ibb.co/5FC7mg2
Hi there,
you can try reducing the bottom padding in Customizer > Layout > Sidebar to reduce that space.
I know but, when it's a recent post list widget the spacing on Customizer > Layout > Sidebar gets ingorned.
That spacing is coming from the bottom margin you have added in this CSS:
.right-sidebar #recent-posts-2 ul li {
border-bottom: dotted 1px #C0B2CA;
margin-bottom: 5%;
padding-bottom: 5%;
font-size: 15px;
font-weight: 500;
}
.right-sidebar #categories-2 ul li {
font-size: 15px;
font-weight: 500;
border-bottom: dotted 1px #C0B2CA;
margin-bottom: 5%;
padding-bottom: 5%;
}
Remove that CSS and use this instead:
#right-sidebar ul li {
border-bottom: dotted 1px #C0B2CA;
padding-bottom: 5%;
font-size: 15px;
font-weight: 500;
}
#right-sidebar ul li:not(:last-child) {
margin-bottom: 5%;
}
Legend.
Thanks for the help, David.
Wishing you/and the GP Team Happy holidays
You're welcome!