Hello dear support,
I use this code for changing the appearance of Masonry (by Portfolio) sort options:
.av-sort-by-term a {
color: black !important;
font-size: 20px !important;
border:1px solid #5d225b !important;
background: #c88b5e !important;
padding: 10px !important;
}
How can I change the background color and show a border only on the “active” sort option?
Thanks so much for your help,
Itty
Hey Itty,
Thanks for the screenshot, where can we see the element in question?
Best regards,
Rikard
Could someone help me with the upper problem, although it is the weekend?
It would be extremely great.
Also: I would love to be able to delete the “all” sorting option. When I try it, it still shows the first seperator (the dash: / )
I still would like to know how to have a border only around the “active” sorting option.
Thank you very much,
Itty
Hi,
You will need to change the border to 0px and remove the !important; from your custom css in this rule:
.av-sort-by-term a {
color: black !important;
font-size: 20px !important;
border:1px solid #5d225b !important;
padding: 10px !important;
}
The rule should look like this:
.av-sort-by-term a {
color: black !important;
font-size: 20px !important;
border:0px solid #5d225b;
padding: 10px !important;
}
And add this rule:
.av-sort-by-term a.active_sort {
border: 1px solid #5d225b !important;
}
Best regards,
Mike
Hi,
To remove the “All” sort option, try this solution
Best regards,
Mike
Thanks, Mike!
It worked fine.
Yes, please :)