This topic has 6 replies, 3 voices, and was last updated 2 years, 7 months ago ago by Rose Tyler
Hi,
You have provided me with below CSS to achieve this https://prnt.sc/1qba78s
I tried to use the same into my page (“Design”) yet it is not working.
can you help me with what I am missing here?
/* tabs */
.et-tabs-wrapper .tabs-nav {
border-bottom: none;
padding-bottom: 0px;
}
.page-wrapper .et-tabs-wrapper .tabs-nav li {
margin: 10px;
width: 150px;
max-width: 150px;
}
.page-wrapper .et-tabs-wrapper .accordion-title {
margin: 10px 0;
}
.page-wrapper .et-tabs-wrapper .tabs-nav li, .page-wrapper .et-tabs-wrapper .tabs .accordion-title {
border: 1px solid #999 !important;
background: #F0F0F0;
padding: 0 !important;
}
.tabs .tab-title, .page-wrapper .et-tabs-wrapper .accordion-title span{
padding: 10px 10px 10px 10px !important;
font-size: 16px !important;
font-weight: 500;
text-transform: none !important;
color: #999;
}
.tabs .tab-title:hover, .tabs .tab-title:focus, .page-wrapper .et-tabs-wrapper {
color: #e95d2a;
}
.et-tabs-wrapper .tabs .tab-title.opened,
.et-tabs-wrapper .tabs .tab-title:hover,
.page-wrapper .et-tabs-wrapper accordion-title:hover span,
.page-wrapper .et-tabs-wrapper .accordion-title.opened,
.page-wrapper .et-tabs-wrapper .accordion-title.opened span {
color: #fff!important;
background-color: var(--et_active-color);
}
.template-content .et-tabs-wrapper .tabs-nav li.et-opened:before,
.template-content .et-tabs-wrapper .tabs .accordion-title.opened:before,
.template-content .et-tabs-wrapper .tabs-nav li.et-opened:before {
display: none;
}
.et-tabs-wrapper .tabs-nav {
padding-bottom: 0px;
}
can u please help with this?
I didn’t receive any feedback on this. Can you please help me?
Hello,
That code was for the XStore tabs https://prnt.sc/1tcaw46 not for the WPBakery default tabs element. Do you want to use WPBakery default tabs with that design? Why don’t use your XStore tabs element?
Regards
Hi
sorry my bad. now i chose a correct tab and it is working well in desktop. not sure why i get double borders when shit to mobile. https://prnt.sc/1tf0k1v
any idea?
Hello,
Add this Custom CSS code also:
.page-wrapper .et-tabs-wrapper .accordion-title.opened span {
border: none !important;
}
Regards
The issue related to '‘CSS for Tab element’' has been successfully resolved, and the topic is now closed for further responses