Issues with Accordion styling
See original GitHub issueIm trying to use PF4’s Accordion but Im facing a few issues
- every AccordionToggle is wrapped in heading (h1-h6, which can be configured) - I dont want that, I cannot even pass a custom className to the heading. It seems to me that this wrapping inside heading tag is unnecessary. If i’d like to use heading tag I can specify it as
<AccordionToggle ... >
<h3>...</h3>
</AccordionToggle>
- adding custom classes to AccordionToggle’s button element via passing className such as
<AccordionToggle className="my-custom-classname" >
to change the default padding/border but Im not able to do so as applied class .pf-c-accordion .pf-c-accordion__toggle
has precedence.
Issue Analytics
- State:
- Created 4 years ago
- Comments:12 (12 by maintainers)
Top Results From Across the Web
Accordion css style is broken
Hello, Since the last update the formatting of the accordions seems to be broken and reset back to the default formatting.
Read more >Problems styling MaterialUI Accordion heading - css
im having problems with the styling in my Accordion Heading. I set my Accordion Contents like this: <Accordion heading1= { <DishItem name=" ...
Read more >Accordion Design: UI Best Practices & Examples
An accordion is a menu composed of vertically stacked headers that reveal more details when triggered (often by a mouse click).
Read more >Accordion styling issue: · Issue #3685 · vmware/clarity
When the last panel of a accordion is expanded, the bottom corners of the panel are still rounded. And it seems that there...
Read more >Accessible Accordion - examples and best practices - Aditus
Learn how to create accessible accordion components with practical examples and code samples.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
@mcoker I placed a P2 on this issue because it is not blocking. Feel free to review and correct if needed.
@rawagner do you have any follow up questions here or did @redallen 's answers help you out?