Topic: Accordion icons width
neocheck premium asked 2 years ago
I have a slim sidenav with some accordions inside. If I use font-awesome icons, they don't get the same width although I use the fa-fw class.
Expected behavior
All the icons with the same width and literal beginning at the same position.
Actual behavior
Icons not aligned and literals beginning at different positions.
Resources (screenshots, code snippets etc.) Here you can find the snippet: https://mdbootstrap.com/snippets/standard/neocheck/4597567
Kamila Pieńkowska staff answered 2 years ago
Here is workaround for you: https://mdbootstrap.com/snippets/standard/kpienkowska/4605763
neocheck premium answered 2 years ago
Sorry, I think the answer is not correct. If I remove the me-2 from < i > objects and add "nbsp; nbsp;" between < i > and < span > objects I get the same problem.
I also tried adding the marging to < span > class as "ms-2" and I got the same result.
You can see the snippet where I changed the margins: https://mdbootstrap.com/snippets/standard/neocheck/4597567
Kamila Pieńkowska staff answered 2 years ago
Actually they do get centered. But margin you added to icons interfere with their position.
neocheck premium commented 2 years ago
Sorry, I think the answer is not correct. If I remove the me-2 from < i > objects and add "nbsp; nbsp;" between < i > and < span > objects I get the same problem.
I also tried adding the marging to < span > class as "ms-2" and I got the same result.
You can see the snippet where I changed the margins.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Premium
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 6.0.0
- Device: PC
- Browser: Chrome
- OS: Windows
- Provided sample code: No
- Provided link: Yes