Simple Dropdown Menu Bar using only HTML & CSS

แชร์
ฝัง
  • เผยแพร่เมื่อ 7 ม.ค. 2025

ความคิดเห็น • 144

  • @RAO_SAB_804
    @RAO_SAB_804 3 ปีที่แล้ว +6

    After a lot of search finally i found it it's Fabulous Effort thanks from Pakistan

  • @cosmosfx833
    @cosmosfx833 2 ปีที่แล้ว +2

    You are literally the best, you toturials are fast, simple, easy to understand. The outcome is always fantastic, very beginner friendly, much of my first site was built using your toturials
    Thank you so much! Keep up the excellent work, subscribed!

    • @CodingNepal
      @CodingNepal  2 ปีที่แล้ว +1

      Thank you so much you too for loving my tutorials

  • @manofsteppe179
    @manofsteppe179 4 ปีที่แล้ว +1

    Cool, more than clear, have not seen better channel than your in youtube, way to go!

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว

      Thank you so much and you'll also love these dropdown menus:
      - th-cam.com/video/Iyx_809qwoc/w-d-xo.html
      - th-cam.com/video/NLeSi_Gi2xs/w-d-xo.html
      - th-cam.com/video/A0NNmC3bazI/w-d-xo.html

    • @manofsteppe179
      @manofsteppe179 4 ปีที่แล้ว

      @@CodingNepal Appreciate!

  • @Ajy724
    @Ajy724 3 ปีที่แล้ว

    from 2 days i was finding how to make down drop menu but i dint not but i finally find an awesome video thanks bro :)

  • @brendensong8000
    @brendensong8000 2 ปีที่แล้ว +1

    Thank you for the video! Like everyone else said, your tutorials rock!!! learned so much!

  • @muhammadfirdausismail9372
    @muhammadfirdausismail9372 3 ปีที่แล้ว

    I have faced many problems before i watching this . You are a hero bro.. thank you ❤️

  • @abed7983
    @abed7983 3 ปีที่แล้ว +1

    Thankyou so much!!!
    Nice content! Keep it up!!! 🔥🔥🔥

  • @AsmaKhan-qf6gd
    @AsmaKhan-qf6gd 2 ปีที่แล้ว

    Sir Your are fabulous plz keep making videos like this I really love your videos and your website as well thankkkkkk uuuuuuuuuuu soooooooo muchhhhhhhhhh 😀

  • @sangaytshering8517
    @sangaytshering8517 3 ปีที่แล้ว +6

    Man I Love Your Codes,design Ideas and your website THANK YOU!

  • @BharatReacts229
    @BharatReacts229 3 ปีที่แล้ว +1

    *How can i make navbar fixed even if i clicked and opened another page by clicking on one of the drop down option???*

  • @josephlivengood4508
    @josephlivengood4508 2 ปีที่แล้ว +1

    This is really good but how do we make mobile friendly? if they tap the dropdown it will navigate to that page. Can you make one for mobile?

  • @lostinspain
    @lostinspain 3 ปีที่แล้ว

    very good job!!!! well done, really! Greetings from Italy

  • @DaGreatMJ_
    @DaGreatMJ_ 4 ปีที่แล้ว +4

    Thank you so much! 💕

  • @satyammishra8357
    @satyammishra8357 4 ปีที่แล้ว +1

    Thanks a lot ...your explanation skill is very fabulous keep it

  • @shivmaan3974
    @shivmaan3974 2 ปีที่แล้ว +1

    Thank you very much.🙏🏻🙏🏻🙏🏻🙏🏻

    • @CodingNepal
      @CodingNepal  2 ปีที่แล้ว +1

      You are so welcome!

  • @maplefive9996
    @maplefive9996 4 ปีที่แล้ว +8

    Good demonstration from deaf and muted person

  • @samridhi1840
    @samridhi1840 3 ปีที่แล้ว

    Sir have you given the 2nd in hyperlink what is it all about ?

  • @breyonaparker
    @breyonaparker 4 ปีที่แล้ว +2

    Great Video!! Thanks!!

  • @rotten8000
    @rotten8000 4 ปีที่แล้ว +3

    hey there I need some help, when I write Inline-block the menu is droping down, its not like yours, i tried different stuff and only inline-flex works, its same as yours but the position is bellow that bar... can u help me how do i make it look like yours?

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว

      Send me your codes on Instagram.

    • @rotten8000
      @rotten8000 4 ปีที่แล้ว

      @@CodingNepal I sent u the codes, my nick on Instagram is yametekudosai

  • @johnrobson550
    @johnrobson550 4 ปีที่แล้ว +3

    Why to use floats intead of "Flexbox"?

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว

      I've also made many videos on flexbox watch them.

    • @manofsteppe179
      @manofsteppe179 4 ปีที่แล้ว +1

      floats are still valid, big amount of international websites have floats and need devs to support, as far as I know

  • @nguyenhuyhoang4927
    @nguyenhuyhoang4927 4 ปีที่แล้ว +3

    Good job, that's thing I need

  • @Amarpreet_002
    @Amarpreet_002 2 ปีที่แล้ว +1

    So i need help with this thing happening in my webpage if someone can , i created a hover effect over courses in my webpage with ul tag everything is working fine but the problem is it is showing an unaccessory line next to it and some white space above it i dont know what to do (i can share my code )

  • @FreakSheepVODS
    @FreakSheepVODS 3 ปีที่แล้ว

    any idea why the sropdown dossnt stay up because when i hover over the main menu it the dropdown works but atm i what to do to the nav in the dropdown the dropdown menu disepears

  • @mouctechy
    @mouctechy 3 ปีที่แล้ว

    you took me to the next level thank you so much

  • @blacksheeprawrmeow
    @blacksheeprawrmeow 4 ปีที่แล้ว +1

    Hi, I did eveything in the video and it worked perfectly but after I tried again the drop menu would appear but when I go to select a page the sub menu disappears...They only way I can get into the sub menu is if I move the mouse really fast down and it will allow me to select. Would love some help thanks

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว +1

      You may did some mistakes... Please download files from here - www.codingnepalweb.com/2020/06/animated-drop-down-menu-bar-using-html.html

    • @vracar2667
      @vracar2667 3 ปีที่แล้ว

      You probably didnt put your dropdown list into the list that you will hover

  • @darrenlouisuyangurin
    @darrenlouisuyangurin 2 ปีที่แล้ว

    how can i show the dropdown navbar if i make it responsive or in a cellphone view?

  • @shivanidhanak4053
    @shivanidhanak4053 3 ปีที่แล้ว

    You saved me thank you so much ❤

  • @digitals3180
    @digitals3180 2 ปีที่แล้ว

    Sir which is the editor?

  • @wasupman777
    @wasupman777 3 ปีที่แล้ว +1

    do u have any websites people can learn from?

    • @CodingNepal
      @CodingNepal  3 ปีที่แล้ว +1

      No but I share all video tutorials codes here - codingnepalweb.com where you can learn by analyzing codes

    • @wasupman777
      @wasupman777 3 ปีที่แล้ว

      @@CodingNepal thank you

  • @vladislavpetrov2429
    @vladislavpetrov2429 4 ปีที่แล้ว +1

    Ummm can i get some help??? I did it the same as you but i want when i press the button “Contacts” to move to another page. How can i do it??

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว

      Just add another page link inside href attribute of contact anchor tag.

  • @Ijayrushi
    @Ijayrushi 3 ปีที่แล้ว

    great video please try to explain while typing.

  • @kokossi7120
    @kokossi7120 4 ปีที่แล้ว +1

    Nice tutorial sir.

  • @dhruvrajsinhjadeja-vfxarti3085
    @dhruvrajsinhjadeja-vfxarti3085 2 ปีที่แล้ว

    Thank you very so much bro :)

  • @vini-pbs
    @vini-pbs 3 ปีที่แล้ว +1

    Niceee, how to use icons without linking font awesome? My project won't have internet connection

    • @CodingNepal
      @CodingNepal  3 ปีที่แล้ว +1

      Download offline files of it. For more please visit their official website - fontawesome.com/

    • @vini-pbs
      @vini-pbs 3 ปีที่แล้ว

      @@CodingNepal thaaanks

  • @Onaneehsyu9286
    @Onaneehsyu9286 2 ปีที่แล้ว

    i followed this but somehow there are extra spaces below when I hovered over nav ul ul li

  • @phoenixworld2333
    @phoenixworld2333 ปีที่แล้ว

    Great! But what if I want it to show when clicked on?

  • @IGROVOYKANALSHAMIL
    @IGROVOYKANALSHAMIL 4 ปีที่แล้ว +2

    thank you bro!

  • @stollenjack6699
    @stollenjack6699 4 ปีที่แล้ว +1

    Thanks you for this video

  • @tahirrashid7444
    @tahirrashid7444 2 ปีที่แล้ว

    bhai font awesome waly icons html ma add kary ky bad show ni ho ry kiya karo

  • @rumanzahid6671
    @rumanzahid6671 4 ปีที่แล้ว +1

    Thank you dear teacher

  • @abiskarghimire3207
    @abiskarghimire3207 3 ปีที่แล้ว +1

    Kada bro voice pani hala na

  • @user-cf7qp2vj8k
    @user-cf7qp2vj8k 3 ปีที่แล้ว

    C'est absolument fantastique bro

  • @malikfaizjaved9672
    @malikfaizjaved9672 3 ปีที่แล้ว

    sir can you add media query portion

  • @user-iu6uc4vu4o
    @user-iu6uc4vu4o 5 ปีที่แล้ว +1

    It really great and helpful

  • @chegevarra1036
    @chegevarra1036 4 ปีที่แล้ว +3

    Дуже цікаво подивитися на тих трьох людей, які поставили мінуси.

  • @samratgaming5160
    @samratgaming5160 4 ปีที่แล้ว +1

    I didnt Found the Code through the Description Blog so can you please provide me Direct Link ?

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว

      Here is the link www.codingnepalweb.com/2020/06/animated-drop-down-menu-bar-using-html.html... Only colors are different on this design

    • @samratgaming5160
      @samratgaming5160 4 ปีที่แล้ว +1

      @@CodingNepal It tells the Blog doesnot Exist please help

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว

      www.codingnepalweb.com/2020/06/animated-drop-down-menu-bar-using-html.html
      Now go to this link. Actually there are more dots after html so you got an error page.

    • @samratgaming5160
      @samratgaming5160 4 ปีที่แล้ว

      @@CodingNepal Thank you lots of love from kapilvastu😍

  • @carlosandresramirez9808
    @carlosandresramirez9808 4 ปีที่แล้ว +3

    Gracias por el tutorial. Muy bueno y me gustó.

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว +2

      English please

    • @MsSoldadoRaso
      @MsSoldadoRaso 3 ปีที่แล้ว

      @@CodingNepal translate it lol

    • @polarisgamer8704
      @polarisgamer8704 3 ปีที่แล้ว +3

      @@CodingNepal it means: Thanks for the tutorial. Very good and I liked it.

  • @spider3912
    @spider3912 4 ปีที่แล้ว +1

    R u from Nepal

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว

      Yes..

    • @spider3912
      @spider3912 4 ปีที่แล้ว

      @@CodingNepal which subject did you took in ur bachelor

  • @Aishamhmdash
    @Aishamhmdash 4 ปีที่แล้ว +1

    ⁦♥️⁩u very good

  • @МухаммадМамасолиев-о4ь
    @МухаммадМамасолиев-о4ь 3 ปีที่แล้ว +1

    amazing

  • @user-iu6uc4vu4o
    @user-iu6uc4vu4o 5 ปีที่แล้ว +1

    Please make a video about popup box

  • @khouloudmeliani3571
    @khouloudmeliani3571 4 ปีที่แล้ว +1

    how does it work in dreamweaver cs3

  • @brightasinde7034
    @brightasinde7034 ปีที่แล้ว

    Please sir How do you add login, form link inside contact us
    So that when you click on contact it will take you to logging or sign up form. I notice when you where clicking on menue bar I was expecting you to click contact bar but you didn't go there 😂😂 it what I want to learn

  • @gagikavagyan9920
    @gagikavagyan9920 4 ปีที่แล้ว +1

    Is this nav bar responsive

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว

      Watch this video :
      Responsive Drop-down Menu Bar th-cam.com/video/Iyx_809qwoc/w-d-xo.html

    • @gagikavagyan9920
      @gagikavagyan9920 4 ปีที่แล้ว +2

      @@CodingNepal thank you veri much but this one is not responsive?

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว

      Yes this is not responsive check link for responsive.

    • @gagikavagyan9920
      @gagikavagyan9920 4 ปีที่แล้ว

      @@CodingNepal thank you for your help

  • @cyrusbfbulan6573
    @cyrusbfbulan6573 4 ปีที่แล้ว +1

    THANK YOU SIR

  • @Squamousepithilium
    @Squamousepithilium 4 ปีที่แล้ว +2

    I don't paste code. But I type it and I come to know.

  • @syedibramsha4499
    @syedibramsha4499 2 ปีที่แล้ว

    It is responsive or not..

  • @QasimKhan-rw3hc
    @QasimKhan-rw3hc 4 ปีที่แล้ว +1

    bro how can i get your code?

    • @CodingNepal
      @CodingNepal  4 ปีที่แล้ว

      Kindly check description link.. I've provided source code link.

  • @melamindotv1886
    @melamindotv1886 3 ปีที่แล้ว

    bang lain kali jg terlalu cepet dan harus ada suara untuk penejlasannya

  • @vedantvarande8544
    @vedantvarande8544 3 ปีที่แล้ว

    Nice bro

  • @kavithamurugan1526
    @kavithamurugan1526 3 ปีที่แล้ว

    Great video...please provide us the source file🙏

  • @5m940
    @5m940 5 ปีที่แล้ว +1

    no see HTML code ?

    • @CodingNepal
      @CodingNepal  5 ปีที่แล้ว +1

      Send me your Email on my FB Page..

    • @5m940
      @5m940 5 ปีที่แล้ว

      @@CodingNepal I like you style, can you sent me free here ?

    • @5m940
      @5m940 5 ปีที่แล้ว

      @@CodingNepal I want copy here

  • @fernandozhahirsyah7373
    @fernandozhahirsyah7373 2 ปีที่แล้ว

    Href="#" to go to another page???

    • @CodingNepal
      @CodingNepal  2 ปีที่แล้ว

      Yes, but # means don't redirect to any other page. If you put any link there, it'll redirect to the specified link.

  • @victorm4689
    @victorm4689 5 ปีที่แล้ว +1

    I love this

  • @ashrafulrahmansakil9612
    @ashrafulrahmansakil9612 4 ปีที่แล้ว +1

    thanks

  • @md.shahadatalahi3794
    @md.shahadatalahi3794 3 ปีที่แล้ว

    Good

  • @martin4basis
    @martin4basis 4 ปีที่แล้ว +1

    i like people

  • @dsingh125
    @dsingh125 2 ปีที่แล้ว

    Are smjha bhi dia kro jisse basic wale smjh jae

  • @speedycoder8450
    @speedycoder8450 5 ปีที่แล้ว +1

    Can I have a shoutout

  • @syediqbalahmed3176
    @syediqbalahmed3176 4 ปีที่แล้ว +1

    good

  • @peressonpaul3303
    @peressonpaul3303 4 ปีที่แล้ว +1

    Kinda like it

  • @Mrscandeia
    @Mrscandeia 4 ปีที่แล้ว +1

    show. obrigado

  • @linse8524
    @linse8524 4 ปีที่แล้ว +1

    thank

  • @syediqbalahmed3176
    @syediqbalahmed3176 5 ปีที่แล้ว +1

    see later ...

    • @CodingNepal
      @CodingNepal  5 ปีที่แล้ว

      Ok... Keep watching and supporting ❤️

  • @rakeshkumarparida98
    @rakeshkumarparida98 3 ปีที่แล้ว

    You could have explained

  • @dlsstudio
    @dlsstudio 2 ปีที่แล้ว

    I m click website your ads
    You earn

  • @maisamhussaintoorie7119
    @maisamhussaintoorie7119 2 ปีที่แล้ว

    ❤❤❤

  • @gytisgytis5547
    @gytisgytis5547 3 ปีที่แล้ว

    Using float? Dislike.

  • @prakash655
    @prakash655 5 ปีที่แล้ว +1

    😊😊👍

  • @shankarganeshacharya4272
    @shankarganeshacharya4272 2 ปีที่แล้ว

    Need help in one of the files how do i contact you

  • @hamimh4485
    @hamimh4485 5 ปีที่แล้ว +1

    • @CodingNepal
      @CodingNepal  5 ปีที่แล้ว +1

      Thank you so much for your comment

  • @ramireddygayathri2022
    @ramireddygayathri2022 2 ปีที่แล้ว

    thanks.