Accordion vertical is quite popular in web development, but horizontal accordion is required in few cases to that in this article we will use pointer-events. We will take the writing-mode to change the accordion title view. And use the transform to rotate the whole accordion.
Below program illustrates the above approach:
- Before Clicking Accordion:
- After Clicking Accordion:
- How to accordion scroll to top to open content in Bootstrap ?
- How to change (-, +) symbol with a button in Bootstrap Accordion ?
- How to make a Bootstrap 4 accordion collapse when clicking the whole header div ?
- How to make horizontal scrollable in a bootstrap row?
- How to display multiple horizontal images in Bootstrap card ?
- Bootstrap (Part-4) | Vertical Forms, Horizontal Forms, Inline Forms
- How to create Right Aligned Menu Links using HTML and CSS ?
- How to make an image center-aligned (vertically & horizontally) inside a bigger div using CSS?
- Include Bootstrap in AngularJS using ng-bootstrap
- CSS | Layout - Horizontal & Vertical Align
- How to make horizontal line with words in the middle using CSS?
- How to make a div fill a remaining horizontal space using CSS?
- Difference between Horizontal and Vertical micro-programmed Control Unit
- What's new in Bootstrap v4.3 ?
- Bootstrap 4 | Tables
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.