Archived topic
Sidebar Widget Title Background Customization.
7 replies · Started by Shivam on August 29, 2021
It is little complicated for me to explain, so please bear with me...
I have a table of content widget in sidebar on this page (link).
I want the widget heading to look something like this (link)
My current CSS for sidebar widget is following :
/*table of content*/
div.ez-toc-widget-container ul.ez-toc-list{border: 1px solid #e5eef6; border-radius:5px; padding-top:35px;}
.widget-title{margin-bottom:-10px!important; background:#fff!important; padding-right: 10px; padding-left: 10px; margin-left: 70px; }I don't know why my widget title background is not covering the border part. (screenshot) Can you help me with this? I have added my site username password in below area.
Hi there,
can you link us to a post where we cans see the ToC
Here is the link David - Click Here
Hi there,
Try adding this CSS:
.widget .ez-toc-widget-container .widget-title {
width: fit-content;
padding: 20px;
margin-left: auto;
margin-right: auto;
background-color: white;
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%, -50%);
z-index: 999999;
}
.widget .ez-toc-widget-container {
overflow: visible !important;
}
div.ez-toc-widget-container ul.ez-toc-list {
border: 3px solid black;
border-radius: 10px;
}Here's the effect - https://share.getcloudapp.com/xQu67bPd
Change the border color and thickness to your preference. :D
Hey Elvin, It has definitely improved but I guess it still needs little modification . (Screenshot) I want the 'page content' text in one line.
Can you look at it please?
Add this property to .widget .ez-toc-widget-container .widget-title
white-space: nowrap;
Also, change the padding from padding: 20px; to padding: 0 20px;.
Thankyou Elvin it worked, You guys have been the best support one can demand from a Theme provider.
No problem. :D
