Technical documentation page: mobile vs desktop question

Here’s my technical documentation page. https://codepen.io/mghollis38/full/VRzOQP

I noticed that when I pull it up on my phone, I can’t click the links on the navbar. Also, it seems too large for the mobile screen. Where do I need to look in my code to find where to fix this?

Also, any other suggestions you have are welcome. I tried to make it more “mine” by documenting some work I had done. But that work didn’t include any code. So I added a section in order to pass the tests. I’ll remove it before adding to a portfolio.

Your media query is where you’d restyle/resize your navbar.
If it’s a help, Wes Bos (wesbos.com/courses) has quite a few free courses. The one that I found that helped with resizing this type of navbar was in ‘What the Flexbox’. The vids are short and very instructional.

And I’m going to use something I found on Bootstrap that helps with breakpoints;
≥ 1200px is extra large desktop devices
≥ 992px is medium desktop devices
≥ 768px small devices…tablets
< 576px extra small devices…phones

1 Like

Thank you. I’m going to go back and check it tomorrow. I appreciate the help.

You’re welcome…and I updated my post with some add’l info that you may find helpful.

1 Like

Absolutely helpful. I’m considering going back through the freeCodeCamp lessons to reinforce what I “learned” but didn’t take notes on. I’ll check out Wes Bos as well. Thanks.

The color combination is not good…You should work on that. Apart from that, your work is good :+1:

I guess what @moshe wanted to say is that your color combination fails to satisfy accessibility requirements: https://webaim.org/resources/contrastchecker/?fcolor=4D4E53&bcolor=5882FA

2 Likes

Thank you. I’m not through with it. Once I tweak it, I will let you know.

Thank you for the link. I will exam what I’ve chosen and see what I can make better.

Thanks for this site @jenovs, some very cool stuff on here!

1 Like

Yeah that’s very correct

Could you check now please? Is the color combination better?

Yeah that’s better now

1 Like