Tagged: Accordion
I’m getting a weird styling issue. It seems to be a :focus or :active issue but it’s hard to say. When you click on an accordion element to expand it a blue line is added above and below the item title. When you close the element a blue line stays at the top of the element until you click on something else.
I’ve tried overriding the custom styling by changing the border-color of .toggler but that just adds a border inside of those lines which makes me think it’s not actually a border at all.
Any idea how to get rid of these?
Hi, same here since update on Enfold 4.6.3.1. Bug or any idea to fix it? Thx
Hi,
Please try the following in Quick CSS under Enfold->General Styling:
p.toggler:focus {
outline: -webkit-focus-ring-color auto 0 !important;
}
Best regards,
Rikard
Thx Rikard, but no effect.
That seemed to fix it for me. Thanks!
In Chrome browser yes, but not in Safari….
Hi Rikard
This is a strange behavior since last Enfold Update. Result with your Custom CSS:
Chrome Desktop: solved
Chrome IOS Mobile App: no effect
Safari Desktop/Mobile: no effect
This one solved the problem with all browsers (see: https://kriesi.at/support/topic/blue-border/)
.av-minimal-toggle.togglecontainer .av_toggle_section .toggler:focus {
outline: none;
}