I'm struggling to figure out how to display the navbar horizontally across the page instead of vertically. I've experimented with different solutions, but it seems like the issue lies within the ul class. Unfortunately, I haven't been able to resolve it yet.
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="/"><img src="/static/kkapital.png" align="left"></a>
</div>
<ul class="nav navbar-nav navbar-left">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Page 1</a></li>
<li><a href="#">Page 2</a></li>
<li><a href="#">Page 3</a></li>
</ul>
</div>
</nav>
</body>