[Resolved] Making the last list item on the sidebar widget to margin-bottom to 0

Home Forums Support [Resolved] Making the last list item on the sidebar widget to margin-bottom to 0

Home Forums Support Making the last list item on the sidebar widget to margin-bottom to 0

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #1564499
    Huseyin

    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;
    }
    #1592806
    Huseyin

    please check the screenshot
    https://ibb.co/5FC7mg2

    #1592986
    David
    Staff
    Customer Support

    Hi there,

    you can try reducing the bottom padding in Customizer > Layout > Sidebar to reduce that space.

    #1593054
    Huseyin

    I know but, when it’s a recent post list widget the spacing on Customizer > Layout > Sidebar gets ingorned.

    #1593060
    David
    Staff
    Customer Support

    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%;
    }
    #1593458
    Huseyin

    Legend.

    Thanks for the help, David.

    Wishing you/and the GP Team Happy holidays

    #1595175
    David
    Staff
    Customer Support
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.