DEV Community

Mitesh Kamat
Mitesh Kamat

Posted on

Scrollable tabs with Bootstrap 4

Introduction

This post is about creating scrollable tabs using bootstrap.

Whenever a requirement of creating a tab bar comes up, we tend to think of how this would look in mobile view. If we are short of time, we look for options like plugins or does bootstrap has what I need which I can leverage and customize later on.

Same happened with me and I found out Bootstrap 4 doesnot give me such a component.

Then, I used the existing bootstrap 4 markup for tabs customised it to my needs and made it scrollable.

what I used?

Bootstrap 4.4.1
Small JavaScript code (3 liner)
Default template for tabs from bootstrap

And this is how it looks like https://codepen.io/miteshkamat27/pen/QWbYPPW

I hope it reduces your pain in search of a scrollable tab bar.

Cheers !!!

Discussion (0)