After adding the Bootstrap carousel to my index.html, the navbar unexpectedly switched to a vertical layout.
I tried adjusting various elements such as font size and width, but it seems like the issue lies within the carousel itself. Whenever I include the bootstrap library with this line of code:
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">Is there a way to resolve this and restore the navbar to look consistent with other pages (i.e., positioned at the top horizontally)?
In regard to the navbar, I have a base.html file that contains the navbar code, which is extended on every page.
https://i.sstatic.net/Q3vgY.png
index.html
{% extends "morse_logs/base.html" %}
{% block content %}
{% load static %}
<title>Home</title>
... [remaining code unchanged] ...
</div>
{% endblock content %}
base.html This is the file for my navbar
{# Load the tag library #}
... [remaining code unchanged] ...
</body>
gameDirectory.html normal webpage layout
{% extends "morse_logs/base.html" %}
{% block content %}
{% load static %}
<link rel="stylesheet" href="{% static 'morse_logs/css/style.css' %}">
{... [remaining code unchanged] ... }
</div>
{% endblock content %}