custom checkbox

Anonymous

#38789

Hi,

I was wondering how I can change the style/design of the chechbox.
Thanks in advance.

Christine

Ross Moderator

#38817

You would need to use CSS:

.searchandfilter input[type=checkbox]
{
    background-color:#f00;
}

S&F also support some more advanced CSS customisations, using the label as this is directly after the checkbox, eg:

http://stackoverflow.com/questions/5275857/highlight-label-if-checkbox-is-checked

and

https://css-tricks.com/the-checkbox-hack/

Thanks

Anonymous

#38878

Thank you for the response. But the css solution is not working in all browsers right? Not in IE. Is there a javascript solution fix this that is compatible with this plugin?

Kind regards,
Christine

Ross Moderator

#38880

Hey Christine

Sure, the checkbox hack is not really a hack at all, most example just use the “adjacent sibling” combinator:

https://css-tricks.com/almanac/selectors/a/adjacent-sibling/#browser-support

I just tested the links above in IE and they work fine (latest version that is).

Thanks

[Author]

Posts