# Help on responsive navbar

**URL:** <https://forum.freecodecamp.org/t/help-on-responsive-navbar/330478>\
**Category:** General\
**Created:** [December 4, 2019, 1:45am UTC](https://forum.freecodecamp.org/t/help-on-responsive-navbar/330478 "2019-12-04T01:45:18Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![sbfergus](https://avatars.discourse-cdn.com/v4/letter/s/b3f665/32.png) [@sbfergus](https://forum.freecodecamp.org/u/sbfergus)\
**Post date:** [December 4, 2019, 1:45am UTC](https://forum.freecodecamp.org/t/help-on-responsive-navbar/330478/1 "2019-12-04T01:45:18Z")

</div>

I need some help getting my navbar to position correctly.

Here is my link:

[https://codepen.io/sbfergus/pen/dyPPzJE?editors=1100](https://codepen.io/sbfergus/pen/dyPPzJE?editors=1100)

I’m real close but i dont know how to get the hamburger icon to display on the right side of the screen after clicking it. Also it appears the nav in smaller screen size has green bars of varying length, not sure how to resolve that either.

Any help would be much appreciated, been working on this for days and very burnt out…

---

<div class="post-metadata">

**Author:** ![lucassorenson](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/lucassorenson/32/115883_2.png) [@lucassorenson](https://forum.freecodecamp.org/u/lucassorenson)\
**Post date:** [December 4, 2019, 3:34am UTC](https://forum.freecodecamp.org/t/help-on-responsive-navbar/330478/2 "2019-12-04T03:34:16Z")

</div>

Hi sbfergus,

I think the problem is coming from this line of CSS:

```auto
.nav-list.responsive li {
		float: none;
	}

```

Try changing that to `float: right;`

---

<div class="post-metadata">

**Author:** ![sbfergus](https://avatars.discourse-cdn.com/v4/letter/s/b3f665/32.png) [@sbfergus](https://forum.freecodecamp.org/u/sbfergus)\
**Post date:** [December 5, 2019, 10:32pm UTC](https://forum.freecodecamp.org/t/help-on-responsive-navbar/330478/3 "2019-12-05T22:32:58Z")

</div>

Your the man! That worked to get the hamburger to move right but I’m still dealing with an awkward gap between the responsive menu options and the rest of the page. Any ideas on that?

---

<div class="post-metadata">

**Author:** ![sbfergus](https://avatars.discourse-cdn.com/v4/letter/s/b3f665/32.png) [@sbfergus](https://forum.freecodecamp.org/u/sbfergus)\
**Post date:** [December 5, 2019, 10:55pm UTC](https://forum.freecodecamp.org/t/help-on-responsive-navbar/330478/4 "2019-12-05T22:55:05Z")

</div>

Nevermind I figured it out. I had to remove the margin-right in this:

```auto
nav {
	display: relative;
	margin-right: 25px;
	float: right;
}

```

---

<div class="post-metadata">

**Author:** ![lucassorenson](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/lucassorenson/32/115883_2.png) [@lucassorenson](https://forum.freecodecamp.org/u/lucassorenson)\
**Post date:** [December 6, 2019, 1:18pm UTC](https://forum.freecodecamp.org/t/help-on-responsive-navbar/330478/5 "2019-12-06T13:18:49Z")

</div>

That’s funny, I had removed that margin as well because I thought it looked weird. I forgot to put that in my answer. Glad you figured that out, and glad to help.

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 16, 2021, 11:31am UTC](https://forum.freecodecamp.org/t/help-on-responsive-navbar/330478/6 "2021-01-16T11:31:16Z")

</div>

Closed on January 16, 2021, 11:31am UTC


