How to Make a Responsive Navbar with Flexbox? | Well Explained

CSS Icons: (W3Schools)

In this video, I have simply explained how to make a Responsive Navbar with Flexbox. Hope you all like this video. Comment your favorite topics. Please subscribe and share. Thank you :-)

#WellExplained #navbar #flexbox

© 2020, Well Explained. All rights reserved.

[well-explained]

3:31 - flex: 1;
Which forces the flex item to take 100% of free space of the container.

[saitejaswinisurisetti]

thank u for ur wonderful tutorial after 1week of dying to be creating a navbar responsive u made it simple with flex ...thanks a lott❤❤

[biologyfacts]

I was trying to make a responsive navbar from almost 6 months but i couldn't make such a responsive navbar thank u so so much

[digvijaydhakate]

Very beautiful and simple way. Thank you bro

[maheshappaji]

video is very useful but please avoid that music and replace it with ur explanation
it helps when u talk and explains about procedure .

[abdomahmoud]

but I wonder how to make a transition on the menu when it pops down

[webdevelopment]

How to change the code so that this menu have a x to close the mobile menu ? It should change from = into x .

[mohammediftekhar]

Guys instead of
.navbar li{
padding: 1rem;
}
at 3:02 use-
.navbar li>a{
padding: 1rem;
display: block ;
}


if you don't use this you will not be able to click on a link unless your mouse cursor is directly on the content. I know this is a little bit complex but try it...

[Acesif]

I'm sorry but your video style really doesn't match your channel name. You haven't explained anything rather you demonstrated what you did, without explaining us why you did what you did.

[mahmoudsayed]

can you make a video to create Responsive Navbar with Dropdown please?
i need your help

[caiosantos]

It doesn't work when I click the "hamburguer"

[thenoob]

you should change your channel name to "Very Well Explained"