Is there any possibility to make navigation bar responsive by using only HTML and CSS?

Is there any possibility to make navigation bar responsive by using only HTML and CSS?
0

#1

Tell us what’s happening:
Now I am developing a personal portfolio page as a part of FCC curriculum. When a device viewport shrinks, I want to hide current nav menus under a single button called menu button.

when I googled it, most of the people use javascript and some other languages in their code but I need to implement with only using HTML and CSS. Is it possible?

Your code so far


Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage


#2

Why do you need to only use HTML and CSS?

It is possible using media queries to use on HTML and CSS.

See this page for a menu which uses only HTML and CSS


#3

Hey @Saseek,

Ofcourse, it is possible.
First go about making a normal navigation bar and then go about making it responsive using Css grids, flexbox and media queries.
However, if you want a quick fix, you can use bootstrap and you will have a good-looking responsive navbar.
Hope that helps.


#4

Because FCC recommends using plain CSS and HTML only. No other specific reason


#5

In the same paragraph it states “You can use Bootstrap or SASS if you choose.”


#6

Yes, but I am a beginner, and I don’t know all those languages. However thanks for your timely reply😊


#7

Then stick with plain CSS for now and then you can always make changes to your projectsr once you have learned about Bootstrap and SASS.