Simple dropdowns (accordion)
Simple accordion using Details and summary elements. Accessible out-of-the-box.
Example
Supported banking services
If you need help with managing your money, we have options that could help you.
To see what help is available (for yourself or someone else) visit supported banking
Power of attorney
Power of Attorney lets you arrange for someone you trust to make decisions on your behalf and manage your finances on your behalf.
You may want to do this due to a change in your health or circumstances. If you don’t need someone to help you now, you can also set up a Power of Attorney for the future too.
Our accessibility statement, (an extremely long descriptive text to force more than a single line to activate a dropdown accordion section on desktop or mobile)
We want to increase the accessibility and usability of our services. You can see how we’re working towards this in our accessibility statement
Other…
Features
Note: Completely removing the disclosure triangle (display:none) will prevent the open/closed state being announced in Firefox + VoiceOver, but not in other browser / screen-reader combinations.
Ref:
Ref:
Best to use details/summary with default triangle, but, if visual is essential, then use a transparent colour, and remove the space it occupies.
Do you have a more complex requirement? See: Multi-level Accordions - Using details/summary - one open at a time