Jquery Accordion widget - remove the icon and padding

Question

Hi,

I'm new to jquery and i'm trying to find out if it's possible to create simple accordion without the arrow icon and without padding at all inside the accordion content.

I want to use the whole content space, and it seems like jquery accordion widget auto create some padding as the width of the arrow icon.

Thanks! Lior

Answer 1

All you need to do is add your own CSS to remove the icon and padding, or override the default CSS with something like this:

#accordion .ui-icon { display: none; }
#accordion .ui-accordion-header a { padding-left: 0; }

if accordion was the ID you where you called the function (see the demo)

Oh and if you want to remove the content padding, use this CSS:

#accordion .ui-accordion-content { padding: 0; }