Topic: ListGroup: Weird behavior when adding .active class
*Expected behavior*I implemented a ListGroup with the option to click on an entry and make it active by adding the .active class. When I change the active status from one entry to another, the list length increses by like 1 pixel and then goes back to the previous length (Actually, just the toggled items change their height). You can see the same effect on the example https://mdbootstrap.com/docs/standard/components/list-group/#section-javaScript-behavior.
*Actual behavior*I would like to have no change in height when toggling the active class. How can this be accomplished?
*Resources (screenshots, code snippets etc.)*See you example in the documentation: https://mdbootstrap.com/docs/standard/components/list-group/#section-javaScript-behavior
Hi,
Add this CSS:
.list-group-item+.list-group-item.active {
margin-top: 0px;
}
Here is the snippet https://mdbootstrap.com/snippets/standard/d-wajszczuk/3886098.
Keep coding,
Dawid
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB Standard
- MDB Version: MDB5 4.0.0
- Device: PC
- Browser: Chrome
- OS: Windows
- Provided sample code: No
- Provided link: Yes