# Technical Documentation Page #4

**URL:** <https://forum.freecodecamp.org/t/technical-documentation-page-4/439940>\
**Category:** I Built This\
**Created:** [January 11, 2021, 5:58am UTC](https://forum.freecodecamp.org/t/technical-documentation-page-4/439940 "2021-01-11T05:58:35Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![ShaniaKond](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/shaniakond/32/190276_2.png) [@ShaniaKond](https://forum.freecodecamp.org/u/ShaniaKond)\
**Post date:** [January 11, 2021, 5:58am UTC](https://forum.freecodecamp.org/t/technical-documentation-page-4/439940/1 "2021-01-11T05:58:35Z")

</div>

Just completed this project.  
All feedbacks are welcome,

Thank you!

[[https://codepen.io/shaniakond/full/ExgRJZe](https://codepen.io/shaniakond/full/ExgRJZe)]

---

<div class="post-metadata">

**Author:** ![Roma](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/roma/32/112899_2.png) [@Roma](https://forum.freecodecamp.org/u/Roma)\
**Post date:** [January 11, 2021, 3:29pm UTC](https://forum.freecodecamp.org/t/technical-documentation-page-4/439940/2 "2021-01-11T15:29:00Z")

</div>

Your page looks good @ShaniaKond. Something to revisit;

- Make your page responsive. Remember, the _R_ in _RWD_ stands for _Responsive_
  - There’s a horizontal scrollbar on smaller screens

The user story says;  
_On regular sized devices (laptops, desktops), the element with `id="navbar"` should be shown on the left side of the screen and should always be visible to the user._  
So on smaller devices you can move the navbar to the top. Where would be a good breakpoint for this?  
As a hint, start with the narrow view (mobile) design first and then work your way wider, adding breakpoints where needed for the wider design.

---

<div class="post-metadata">

**Author:** ![ShaniaKond](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/shaniakond/32/190276_2.png) [@ShaniaKond](https://forum.freecodecamp.org/u/ShaniaKond)\
**Post date:** [January 12, 2021, 6:59pm UTC](https://forum.freecodecamp.org/t/technical-documentation-page-4/439940/3 "2021-01-12T18:59:17Z")

</div>

So I wanted make it responsive and now by doing so, I totally crashed it. The nav-links aren’t working. Please can you check to see what I did wrong?

---

<div class="post-metadata">

**Author:** ![Roma](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/roma/32/112899_2.png) [@Roma](https://forum.freecodecamp.org/u/Roma)\
**Post date:** [January 19, 2021, 1:24pm UTC](https://forum.freecodecamp.org/t/technical-documentation-page-4/439940/4 "2021-01-19T13:24:55Z")

</div>

> [@ShaniaKond](#):
>
> So I wanted make it responsive and now by doing so, I totally crashed it. The nav-links aren’t working.

Sorry @ShaniaKond but I’m just now seeing this.

I’m not seeing where it crashes but I do see it’s not working. I’ll give you a couple of things to look at;

1. in the `#navbar` selector for now just add the following two lines (these are the only two lines it should contain)

```auto
position: top;
width: 100%;

```

try resizing your browser and see what happens. The `navbar` does not move.  
2. Now, move your media query to the bottom of your stylesheet and try resizing the browser again. The `navbar` moves to the top.

Remember what the _C_ in _CSS_ stands for.  
I think with this bit of help you should be able to move forward with making your page responsive.

Hope that helps.

---

<div class="post-metadata">

**Author:** ![ShaniaKond](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/shaniakond/32/190276_2.png) [@ShaniaKond](https://forum.freecodecamp.org/u/ShaniaKond)\
**Post date:** [January 19, 2021, 7:26pm UTC](https://forum.freecodecamp.org/t/technical-documentation-page-4/439940/5 "2021-01-19T19:26:42Z")

</div>

I think I understand what you’re saying so I’m gonna give it a try.

Thanks!

---

<div class="post-metadata">

**Author:** ![Roma](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/roma/32/112899_2.png) [@Roma](https://forum.freecodecamp.org/u/Roma)\
**Post date:** [January 19, 2021, 8:23pm UTC](https://forum.freecodecamp.org/t/technical-documentation-page-4/439940/6 "2021-01-19T20:23:38Z")

</div>

Ask me if you have any questions.

Be sure to either mention me by name (@Roma) or click the reply button in my post so I’ll get notified.  
If you use the reply button at the bottom of the page I don’t get notified and will only see it if I stumble across it.

---

<div class="post-metadata">

**Author:** ![system](https://global.discourse-cdn.com/freecodecamp/original/3X/e/1/e1c433102e34b46dfaa3e15d13ab9a514b127078.svg) [@system](https://forum.freecodecamp.org/u/system)\
**Post date:** [July 21, 2021, 8:23am UTC](https://forum.freecodecamp.org/t/technical-documentation-page-4/439940/7 "2021-07-21T08:23:46Z")

</div>

Closed on July 21, 2021, 8:23am UTC

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.
