I am currently utilizing <ul class="nav nav-tabs">
, contained within a container. When the breakpoint, indicated by the end of the container, is reached, it automatically moves to a new line. Is there a way to prevent this behavior so that all elements stay inline and I can scroll horizontally instead?
Update: Code snippet below
<div class="jumbotron border">
<div class="row">
<div class="col">
<img src="image.jpg" alt="Placeholder for image">
</div>
</div>
<div class="row">
<div class="col">
<ul class="nav nav-tabs">
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
</ul>
</div>
</div>
</div>