A few animations are a bit too much imo, but apart from that this is the new best Dropdown Tutorial. It could be even better with a bit slower pace (had to set speed to 0.5 and turned off music) and with more explanations, so that I can make the adjustments I want, but aside from that really good tutorial.
Grandioso!, un menu moderno, bonito, funcional y sin usar javascript. Muchas gracias, te ganaste un suscriptor, sigue haciendo videos de esta calidad y tu canal va a crecer. Saludos desde México.
Hey, I was able to create drop down menu using HTML and CSS but the problem is, it is only working when the page is empty. As soon as I add some content to the website, the drop down menu doesn't stay when hovered. can you help?
Thank you for this great work! I have tried to make changes (delete the div with the sign in buttons and set the other buttons to flex-end. Now the toggle is out of screen on mobile devices... What I am doing wrong???
Looks great, works great but . . . when i use this in any way the page it's on won't scroll down. The "page down" key or even arrow keys won't work either. I made a real simple example but of course, can't post links here. Ideas?
Hi, first of all I really like your vids... Im really new to web dev and in the process of learning i tried to add a footer to this code right after the closing main tag but i cant get it to display properly, at first it didnt display at all and it has something to do with the CSS code: height: calc(100vh - 3rem); that belongs to the section in the main. Then by changing these values im able to see the footer but i would like to know how to add a footer that would be part of the whole layout without having to go inside this calc method and setting up values until it looks the way i want it. Thanks in advance.
This is fantastic! Thank you so much! I am running into one odd issue. I have some longer menu titles that I'd like to keep on a single line, but if I increase the dropdown width from 10rem to 16rem, the hamburger menu does not align correctly when I test it in various mobile views. Sometimes it is cut off, and sometimes it disappears altogether. Any idea how to make it behave without having to set the dropdown width back to 10rem?
@@TrueCoder I spoke too soon... once I refreshed my browser, the error reappeared. : / It's not the menu itself but rather the 3-line hamburger icon that is being cut off or disappearing, depending on the media screen size. Very odd.
Buscando bronce encontré oro! muchas gracias por el tutorial, de verdad muy bueno te felciito. Podría agregar iconos a los submenus también cierto? y si este lo quisiera de izquierda a derecha ya que el que muestra abre de derecha a izquierda...
Friend is incredible what you do thank you very much I have learned a lot with your videos .... can you tell me what version you use from the visual studio? or what program are you using please
A very nice multi level drop-down menu/navigation. Thank you. Love especially that you made it in html & CSS only!! There is only one issue in the mobile version....... it's not possible to reach, click: menu/link4 & service/link4
Can I use this code for my website and make some changes of course. I am asking for permission. This fit perfectly for my website. You are awesome and I wish you the best. Just keep going
Thanks True Coder, awesome code, functional and good looking interface. Excuse me, do you know why multi-level dropdown and background-color in overlay div doesn´t work in Chrome 49.0.2623.112 (64-bit). All Responsive Animated Navigation Bar doesn't work on Safari (iOS 12.4.8) either. Is there any way to make it work on those browser´s versions?.
@@TrueCoder I am watching this on my phone now away from my laptop. I saw a dot js file referenced in the video. Does this navigation menu require Javascript or does the Javascript just add elegance?
Thank you very much for sharing to us this cool work! I really appreciate it. can we use this code and make changes? but before I do this I'm asking for your permission thank you ^_^
anyone else getting side scrolling on the body on mobile? After translateX on the .nav-btn, I am getting side scrolling. Even tho the position is absolute
I see you did not add any content. Nor in your code did you make an area for adding content. Is there a reason for this? If it is an over site can you update your github page to include it?
Wooooow You are awesome! I dug the whole net for the responsive navigation menu. Yours is the best!
Thank you bro ! I appreciate that
❤️ From *india (bharta)* 🇮🇳
Thank you for giving such a great or true coder idea 💡
I definitely want to make it
it's not "bharta", it's "Bharat" 🇮🇳
Great contribution to the community, my friend, already a faithful follower of the channel .... Greetings from Nicaragua
Thank you :)
I have an assignment about creating website and all of your videos are useful. Thank you very much!
You're welcome :)
A few animations are a bit too much imo, but apart from that this is the new best Dropdown Tutorial.
It could be even better with a bit slower pace (had to set speed to 0.5 and turned off music) and with more explanations, so that I can make the adjustments I want, but aside from that really good tutorial.
Thanks mate ! Glad it was helpful !
Thanks for your video. I really appreciate it. That's what I'm looking for. Keep up the good work! 🔥
Thank you bro :)
Awesome custom drop-down menu.
Today I, m so happy to see such a talent behind your work
Thank you bro
The input to toggle hamberger menu is very creative bro
Best one I've seen about navbar. It's amazing. Keep on rocking bro...
Thanks Bro !
Astonish tutorial. Thank you for you contribution. Hope you reach sky high subscriber. Subscribed.
I Love your Channel because you also provide the Source codes thank you so much you are great.
Thanks bro !!!
We prefer that you explain and talk instead of music and thank you very much
LOVE FROM INDIA
Impressiv... thank you. Good job!
thanks :)
The best I've ever seen. Great work.
Thank you :)
such a great tutorial thanks it helped so much
You are a true artist!
Thank you !!
THANK YOU VERY MUCH, FRIEND
Grandioso!, un menu moderno, bonito, funcional y sin usar javascript. Muchas gracias, te ganaste un suscriptor, sigue haciendo videos de esta calidad y tu canal va a crecer. Saludos desde México.
Thank you 😊
totally a masterpiece..... much inspired by your work.... keep it up
Thank you bro !
amazing design.
Thanks for the tutorial. It's really helpful.
Most welcome!
You're top! I wish you a million subscribers )
Вы топ! Желаю вам миллион подписчиков )
Thank you !!
Muchas gracias, excelente trabajo.👌
de nada
Awesome!! Once the drop down is clicked in mobile, is there a CSS fix to collapse the clicked menu?
Good creativity nice job
Thanks a lot
good job sir..............................................💡
thank you bro !!
i really like it sir...
but it seems only for intermidiate web developer...
some stuff is really alien for now... but i'll learn it sooner...
thanks!
You're welcome
I will have follow it to make profolio .
Thank you, it's really nice!
You're welcome, and thank you too for your kind words !!
Thank you very much sir you're great
You're welcome bro !
thats great! this what i was looking for.
Thank you
nice work
Do you have a full responsive website html,css with javascript?
Yes, I will make a tutorial about that soon
Thanks. Pretty good option.
Thank you very much, its so helpful
You're welcome bro !
Hey, I was able to create drop down menu using HTML and CSS but the problem is, it is only working when the page is empty. As soon as I add some content to the website, the drop down menu doesn't stay when hovered. can you help?
Thank you so much !!! Keep up the good work !
Thank you bro !
thamks sir/madam
Hello my friend, would you allow me to take the code, change some specifications, and republish it on RUclips platform?
God LEVEL
Excelente Contenido..!
Thank you so much
You're welcome bro !!
Brother thanks alot for this 💕💕💕
Most welcome !
que groso sos!!! muchas gracias!!!
THANKS!
You're welcome!
Thank you for this great work! I have tried to make changes (delete the div with the sign in buttons and set the other buttons to flex-end. Now the toggle is out of screen on mobile devices... What I am doing wrong???
Looks great, works great but . . . when i use this in any way the page it's on won't scroll down. The "page down" key or even arrow keys won't work either. I made a real simple example but of course, can't post links here. Ideas?
thank u
Hi, first of all I really like your vids... Im really new to web dev and in the process of learning i tried to add a footer to this code right after the closing main tag but i cant get it to display properly, at first it didnt display at all and it has something to do with the CSS code: height: calc(100vh - 3rem); that belongs to the section in the main. Then by changing these values im able to see the footer but i would like to know how to add a footer that would be part of the whole layout without having to go inside this calc method and setting up values until it looks the way i want it. Thanks in advance.
@True Coder how to already highlight the link 3(even before we hover over this) of services which contains more link
it's really great
Ótimo vídeo parabéns ✌.
Color and cube change ,when ":hover" :)
.btn {
padding-bottom: 1rem;
padding-top: 1rem;
padding-left: 1rem;
padding-right: 1rem;
position: absolute;
display: inline-block;
font-size: .8rem;
border: 2px solid #fff;
border-radius: 2rem;
line-height: 1;
margin: -0.5rem;
transition: .3s;
text-transform: uppercase;
}
.btn.solid, .btn.transparent:hover{
border-radius: 2rem;
position: absolute;
background-color: #fff;
color: #69bde7;
}
.btn.transparent, .btn.solid:hover{
border-radius: 2px;
color: crimson;
position: absolute;
background-color: transparent;
}
Thank you!!!!!! It's awesome!!!
Most welcome !!
what apps do you use for writing the code?
And thank you for your hard work
vs code
This is fantastic! Thank you so much! I am running into one odd issue. I have some longer menu titles that I'd like to keep on a single line, but if I increase the dropdown width from 10rem to 16rem, the hamburger menu does not align correctly when I test it in various mobile views. Sometimes it is cut off, and sometimes it disappears altogether. Any idea how to make it behave without having to set the dropdown width back to 10rem?
try to give "nav-btn" element a flex of 4
@@TrueCoder That worked perfectly! Thank you! : D
@@AngelaRoquet You're welcome !!
@@TrueCoder I spoke too soon... once I refreshed my browser, the error reappeared. : / It's not the menu itself but rather the 3-line hamburger icon that is being cut off or disappearing, depending on the media screen size. Very odd.
@@AngelaRoquet remove width: 16rem
Buscando bronce encontré oro! muchas gracias por el tutorial, de verdad muy bueno te felciito. Podría agregar iconos a los submenus también cierto? y si este lo quisiera de izquierda a derecha ya que el que muestra abre de derecha a izquierda...
Friend is incredible what you do thank you very much I have learned a lot with your videos .... can you tell me what version you use from the visual studio? or what program are you using please
Thank you bro !!
I am using the last version of visual studio code
Top das galáxias, muito bom.
Thank you !!
Masterpiece
Great job Bro. keep it up. Can u please upload javascript front end application with animated design
Hiii sir,I am new to css can we apply background color to the empty div without mentioning height in css
keep bringing them
Thank you bro !!
A very nice multi level drop-down menu/navigation. Thank you. Love especially that you made it in html & CSS only!!
There is only one issue in the mobile version....... it's not possible to reach, click: menu/link4 & service/link4
Can I use this code for my website and make some changes of course. I am asking for permission. This fit perfectly for my website. You are awesome and I wish you the best. Just keep going
Thank you br, yes you can use it
which theme are you using
Thank you a looot ❤
Most welcome !
Thanks Bro.
But, please may I ask what the inline styles: --i: 0.6s;, mean?
we just put the delay of each element in variable "i"
which theme you useing in the vs code?
Matherial theme
@@TrueCoder oky thanks for gived the reply❤️
hi can you show how to collapse the submenu when the parent menu click once the submenu is shown
Thanks True Coder, awesome code, functional and good looking interface. Excuse me, do you know why multi-level dropdown and background-color in overlay div doesn´t work in Chrome 49.0.2623.112 (64-bit). All Responsive Animated Navigation Bar doesn't work on Safari (iOS 12.4.8) either. Is there any way to make it work on those browser´s versions?.
If we make a donation are we free to attribute and use in our own sites?
yes, of course
@@TrueCoder
I am watching this on my phone now away from my laptop.
I saw a dot js file referenced in the video.
Does this navigation menu require Javascript or does the Javascript just add elegance?
@@christopherjohnchapman No Ididn't use javascript in the video, what you saw was the font awesome cdn
Sir ji ...the bran logo or name...i want to get it in left corner how can i do that....its not moving
When i added my logo in place of brand-name then the logo is sticking on the top left
Please reply
Please make the same features with bootstrap
ok, i'll try
Thank you 🙂 for this
Pls wats d name of the background music
the GOAT 🙌🙌🙌
Genial, buen video
Good job 👍
Thank you
Thank you very much for sharing to us this cool work! I really appreciate it. can we use this code and make changes? but before I do this I'm asking for your permission thank you ^_^
yes you can
Awesome...🔥
Thank you !!
Please make footer for this navbar and edit the image and overlay.
What's the song do it was bangin!
can i use this code in website
Does anybody know, why when Iam in mobile version and I click on the arrows It just realods the page and close the menu? Wheres the problem?
Can't toggle on and off visibility of menu
Good BRO♡
Thank you !!
like it
Bro is this sticky navbar!?
Hi. I got problem with buttons. I don't know why I can't click them :/
Fixed:
Buttons position:
position: absolute;
make sure you give him z-index
@@TrueCoder z-index: 100000000;
And working :D
Background music?
watch it at 0.5 speed
robot is doing designing
anyone else getting side scrolling on the body on mobile? After translateX on the .nav-btn, I am getting side scrolling. Even tho the position is absolute
Too many divs, and the site navigation bar becomes untappable..
see later ...
I see you did not add any content. Nor in your code did you make an area for adding content. Is there a reason for this? If it is an over site can you update your github page to include it?
Position , top, left, transform :initial what is the default values for these