Dropdown Navigation Menu with Flexbox

[@pliniojr95]

Thank you for this video! I was having a hard time on how to build a drop down menu without using JS, and I don't want to use JS for now to make it because i want to master CSS first, before I finally dive into JS, and your video helped me on this. Actually I'll have to spend some more time to understand the usage of the pseudo elements, like the one used to show that line under the parent li. Anyway thank you for the content and hugs from Brazil!

[@madangopalpaul6534]

Thank you so much! I love all of your content, your way of explanation is very clear and understable ❤️your channel is really life saver when it comes to programmers who are self learning❤️

[@beinyourguard]

really simple, really nice and really easy to understand

[@angeladesign737]

Glad it was helpful!

[@danielcir8675]

An amazing video, like all the others!!! Thanks Angela!!!

[@angeladesign737]

Glad you liked it!!

[@breezedoart]

OMG! I was really struggling Thank You so much.

[@kayodeadechinan5928]

Thanks Angela, i like your design process

[@angeladesign737]

Thank you!

[@colindante5164]

Thanks)). Does this technique work on mobile devices where by a user needs to tap on the menu to activate the drop down items ? Also, would the drop down be activated using the "tab" key to navigate? Could anyone please respond? thanks. ))

[@NotPastelDreams]

Your voice is as beautiful as CSS

[@theangel3382]

🥵👌

[@hidarahmadi4473]

Thanks so much I have seen lots of tutorials but you explain your code or your next step very clearly. Lover the way you teach from now on I a gone follow your channel more and more 👏👏👏👏

[@hassaanahmed217]

You are amazing Maam. Thank you soo much!

[@botearners2350]

Hello I am using this nav in my project but it is overlapping my content. And if I give Margin top to my components the whole navbar come down

[@TechayCodeStorm]

❤ nice informative video

[@fjdeveloper]

Great. Thanks for your explanation!

[@angeladesign737]

Glad it was helpful!

[@tymiller2596]

Hello there. Great Channel. Have you made a video on which modern way to "insert" header and footer across multiple HTML pages - similar to the way we used "includes" in .php pages in the past. Thanks you.

[@angeladesign737]

Not yet, but that's a great suggestion!

[@Vidzhut]

Amazing navbar. Can you make a video on how to make this responsive?

[@mridulrawat2640]

Great fan of your videos. Can you tell me what shortcuts were you using while coding? How can you auto complete all the the html tags in codepen?

[@PixelGunner3D]

cant u just use a table header and table list, that way u dont gotta remove all the list buttons and other stuff?

[@林明華-z1z]

請問妳有考慮用中文講解嗎?

[@avitalbercot]

A very nice tutorial! But I'm using sublimeText to code in html/css and I can't put the line under the element of the menu bar... I can't write "&:hover::after" in this editor, there is another technique?

[@GodsMan500]

Do you have a tutorial on making a responsive navbar which will transform to a hamburger menu on a small device? Thanks!

[@fredpourlesintimes]

Why are you using SCSS? Bad idea.

[@MrBoiks]

How do you mean?

[@sianwa11]

Thank you

[@scriptedpixelsltd]

Do you need flexbox applied to the drop down items, with the gap? You’ve added padding to each list item & they’re already in a column naturally as they’re in a UL? Not sure if I’ve missed something here? Just curious

[@angeladesign737]

The gap provides a little more space between each element when they are in the hover state. Instead of using Flexbox you can accomplish this by adding a margin around each element.

[@scriptedpixelsltd]

@@angeladesign737 ah ok, see what you mean. Was just thinking that would having flexbox make the browser work a bit more doing layout over adding margins & paddings to space around elements

[@ashharmansuri6816]

Every cool ,I was looking for it but how to make it responsive?

[@joecok]

Thank u so much

[@martinstevenhernandez5040]

Thank you!

[@nobody-bt7mu]

Thanks!

[@ayaan3429]

This is awesome!

[@angeladesign737]

Thank you!

[@bl7937]

Thank you so much! Very nice tutorial and amazing explanations! Can you please explain how to perform this exact tutorial with a responsive navigation?

[@movealongnothingtosee]

👏👏👏

[@SkyPunkki]

Nice video keep doing this content

[@angeladesign737]

Thank you!

[@arshgoyal9622]

Thanks

[@Pythogoras570BC]

I can assure you, that you have created the most comprehensive "Dropdown Navigation Menu with Flexbox" video. BRAVO! I am wondering whether one could profit from your services and if positive how one could get in contact with you.

[@lxstorxlgm1667]

Thanks !!

[@rohankumarshah5679]

as always great videos. Big Fan. please upload tutorials on React

[@angeladesign737]

Thank you! I have a few tutorials on React on my channel, like this one: kzbin.info/www/bejne/anzbeZaYhp16j7M

[@rohankumarshah5679]

@@angeladesign737 great

[@ClaudioJrTsuyosa]

SCSS??????? WTF

[@theangel3382]

Xd'nt?

[@bigmac786]

you shouldve mentioned in the title that you were going to use SCSS, wasted my time coding this out

[@devbash]

Literally within the first minute she said SCSS was being used.

[@thedoctor1929]

ha. funny. joek's on you. the necromacing here is mainly to let people know that css IS provided. here's a fun--ner fact: you were given all the tools to succeed in replicating this; css included if you see the description the link takes you to codepen which allows to compile scss and will show exactly the css output. you can swap between the two

[@shravyavenny3767]

Thankyou sooo much🫂, im struggling with this for more than a week, watched many videos but nothing helped 😢

[@frankfrank4811]

Fantastic video! THANK YOU!