Navbar buttons stacked, but I want them in a line

1

Hey guys. I’ve tried Googling various solutions, reading the Bootstrap documentation, and searching for YouTube tutorials, but it seems I’m not so sure on how to get my navbar buttons to fit in a line. I’m using CodePen, and I’ve provided my code below to show you what I’m doing. I’ve tried whittling the problem down to its essentials by starting with the most basic navbar possible but nothing I do seems to be working, even the grid system tags (not shown).

Thanks, fellow campers! :slight_smile: I’ll appreciate any advice here, really. Been spending 6+hours trying to figure this out to no avail.

navbar-trouble
navbar-trouble1335×526 61.4 KB

2

Did you included bootstrap CDN at first ? Cause u cannot use bootstrap without the library.

3

nav2

AS you can see the detail is here: class= " nav navbar-nav navbar-right">

5

nav1
nav1914×477 35.6 KB

6

Wait, so even with adding Bootstrap 3 and 4 using quick-add in CodePen i still need to add the cdn link?

7

Okay, sorry. i didn’t include everything from my project in thos code sample. Bootstrap is already working on my pen. I have 2 divs below this sorted with the bootstrap grid system and using various bootstrap styling classes so i know it’s there.

8

nav2

10

Well, I admit, I didn’t have the CDN. I appreciate you having me paste that in there. Whoops .-. I’ll get back to this later and let you know if the other things you showed me fixed it.

11

Okay, guys! I solved it. Turns out I needed to give the unordered list the class “nav” in order for the whole thing to appear in a bar format.