I'm very familiar with HTML, CSS, JS etc and I was really hating webflow official tutorials (felt like wasting time), this is exactly what I needed to better understand webflow and how to do all the things I know how to do in code but not on webflow. So simple!
Thank you a lot man! Webflow has a bunch of tutorials but only yours helped me to understand how it works, step by step. Thank you a lot. It would be interesting to see more videos from you!
@@dereksiuau Actually it would be interesting to see something practical, how to create and use repeatable components, how to deal with Blog and CMS elements. For me as a beginner, it is super interesting to see how you work, all these hotkeys and other stuff that can come after long use of tool. Thx
Thank you so much for this video! I see a bunch of videos saying that it's better to custom make your own navbar, but no one ever talks about how to make it responsive
Hi derek, pls do you know anything about adding facebook pixels to webflow website? Most youtube videos on that only talks about adding the pixel ID. I want to add PageView pixels to certain pages. This is very very important@@dereksiuau
You're a legend Derek! Its nice to fully understand this at last. I was always using the native one but now my nav bars no longer have to suck! Thanks!
Just subscribed to say thanks for these amazing tutorials. As everyone else has said these are the best by far, easy to understand, and you show where everything is on the dashboard. Looking forward to more videos!
Great work Derek! I appreciate this no-nonsense and concise tutorial very much! You explain the reasons behind the decisions, which I find extremely helpful. Looking forward to your upcoming tutorials!
wow. your videos are so much better than the content webflow puts out themselves (never clicks with me for some reason). this was so incredibly clear and helpful! thank you so much!
Great tutorial, keep them going. Was looking for a video on how to create the navbar from scratch and also thank you for showing the essential hamburger button as well.
This was amazing! Thank you so much for taking the time to make this tutorial and explain everything so throroughly. One small suggestion, IDK if it would also be helpful for others, but I personally am a very visual learner, and webflow can sometimes get confusing, so for me it would help a lot if your navigator was open so that we could see what you're selecting each time.
Great suggestion! Noted. Please note that the layer can also been seen at the bottom right of the screen / corner. But I understand what you are saying. Thanks for the feedback!
brother thank you so mych this is what I was looking for so long time, very useful and very to the point, thank you, it is amazing explanation, keep uploading tutorials like this man, this is super useful to the point thanks brother
The Tutorial is really good, thank you! It's important to note that the Navigator panel is not shown in the video, but it's a crucial part of the structure and should be understood, especially by juniors.
Thanks for this, the official webflow tutorial just has you using a prebuilt nav bar. In my experience learning to use templates without learning the basics leads to poor developers and designers overall
Amazing explanation, thank you very much. One question left: When i open the menu on my phone, i can scroll in the background... How do i prevent that?
Great question, you can add a custom code that will make the BG (Body) nonscrollable on menu click. Here is a tutorial on that: th-cam.com/video/k7i2SM_RYRE/w-d-xo.html
Thank you for the video. I'm creating a similar Navbar, but my problem is the Lottie opens on 1st click and closes on 2nd click. After 2nd click it doesn't react. Any ideas what might be wrong?
@@dereksiuau That might have been the problem in the beginning. Once I had more pages, I followed your video step by step and now it works! Thank you!!
thanks for making the tutorial, never would be able to figure this out on my own. lots of steps to make a simple menu. how would i create a menu item with nested items and show that in the desktop menu and mobile menu?
Glad you figured it out and good to see your mind is turning into a developer even the simplest of navbars takes quite some work to build. Can you clarify what you mean by menu item with nested items - perhaps providing an example? I can assit better once that has been answered :D
@@dereksiuau yep so I'm talking about having a dropdown menu for the desktop version, and then a slideout menu for the mobile version for a parent menu item. I have "UX Design" as my main menu item, and then I want to list 3 projects underneath that menu item. When I hover it on desktop, it would fade in as a dropdown menu and then when I tapped it on mobile it would slide out. I figured out how to add the dropdown menu on desktop but I don't know how to convert it to a slideout menu on mobile. I'm also trying to figure out how to fade the dropdown menu in. I selected the dropdown element in webflow, went to interactions and selected "Dropdown menu", and when I set it to fade it also fades out the "UX Design" menu item and the arrow. I don't know how to get it to only fade out the dropdown menu because it doesn't let me select that class specifically. So there's 2 problems here I'm still trying to solve.
Hi, awesome tutorial, found it really easy/useful Only question I have is... is it possible to create the animation for the Hamburger Menu without using a Lottie Anmiation? Really struggling and just want a static Hamburger menu graphic
Yes sir you can! You can replace the lottie file with a static image or div blocks then animate that. The lottie essentially has the animation built in so you will just need to create your own using Webflow interactions. Hope that makes sense.
While I love the official Webflow tutorials, their navbar one only covers to use their prebuilt option instead of teaching you how to build one from zero. Thank you so much for this.
Thank you so much for this. Quick question: how did you get the container within the "section" (the div that you changed to the section class" to be centered and a box? I'm having trouble figuring that out because while it's step by step, it's a little fast and felt some steps were skipped. Thanks so much.
There are many ways to do this, one of the way is to set the container to have auto left margin and auto right margin. Another way would be to set the parent container "section" to flex align centre.
Hey Jaden, thanks for watching commenting. If you want to do the opacity method just replace the "move" (-100% > 0%) with "opacity" (start: 0% to 100%). Hope that helps!
I have just tried this, when I make a new div block for container it is full screen, but you have a small block in the middle Do you think Webflow has changed since then?
Based on your description I had the "new div block for container" to have a max width eg. 1650px with 100width and make sure to put the left and right margin to be auto (that is how it will be centred). So by default everything will be placed on the top right so you have to define it. And no nothing has changed in Webflow haha this is just fundamental HTML / CSS. I hope this helps :) - Derek
when i put a section link behind the texts in the nav bar, the nav bar doesnt close. How can i fix it? Do i have to put an extra animation behind all the text links, so when i klick it, the nav bar closes?
If I understand this correctly, when the navbar is open and user clicks on a navlink you want the navbar to close after the link is pressed, then yes you want to add the animation "Nav Close" to that link. The reason I didn't do it in the tutorial is because you don't need to close the nav if the links takes you to another page. But if you want it to remain on the page then do the above :) Hope that helps and thanks for watching.
@@dereksiuau i tried to animate it in different ways with nav closed, „move“ animation, „show/ hide“ animation. But it doesn’t work. This is so essential for my website because if that doesn’t work, the home side is bad :/
How do I make sure that the nav closes and the animation plays whenever a user clicks on a link? Do I have to create a custom animation for every type of interaction?
Great question you can make the close animation once and assign it to affect the class. So just have the links with the same class and have the interaction affect that class.
I encounter an issue when I open the menu on phone and then scroll down the logo and menu btn both go up with the page. I don't want to make my navbar sticky because it doesn't work with my design... Any solutions?
You could make the menu sticky but not scrollable by using custom code. So when the user taps on the hamburger icon the page (ie Body) is not scrollable. That is what I can think of immediately. Let me know if you want a tutorial.
I'm assuming your nav link takes you to a section on the page rather than a separate page. If this is the case: You want to add the "close NAV" interaction to the nav link class. LMK how it goes!
@dereksiuau: How have you been able to add elements via search shortcuts in NAV Div? Kindly add shortcuts instruction also, it may become easier for the users to index all elements. Thanks for the help.
Command (or Control) Shift E - opens up quick search. Then you can type what you want eg. Div then hit enter. Tat is what I typically do. Extra tip: I hit Command (or control) space to write a class. - Derek
@@lisayang9538 Yeah that's exactly the problem I noticed as well. Without the Option to tell webflow options like nav open / nav closed. You're stuck with first/second click option. Even if the links play the Menu Close animation, your next click on the menu will do nothing, because the lottie is already at zero and the menu closed, having you to do another click
@@saschatribula2650 I see what you are trying to say, this happens in unique situations like a one-page landing page with links scrolling to the page sections. Do you have any suggestions to over come this?
Nice Video! I have a question, if i click on any nav link in mobile view, the nav menu refuses to close, I have to tap on the hamburger again for it to close, how can I fix that?
Hey Derek, fantastic video but one question. Everything is working great but the navbar only seems to render at like 60% of the viewport (and the logo scrunches up to half width when you scroll) on iphones. It works normally in the web viewer and on android. Any idea what I might have done wrong? Thanks again and great work!
I suspect the logo is not rendering properly on iphone because it does not have a defined height and width - if filled in blank it can cause issues on IOS so make sure to at the very least have "auto" on any undefined height or width. Let me know if that works. As for the navbar rendering 60% of the viewport - make sure that on Webflow go to the smallest breakpoint on mobile 320px and make sure all the items fit the nav and doesn't go over. - Derek
I am new to webflow and was wondering what is the shortcut for adding the "div" I am unable to edit the code directly is it because of the plan I have?
With a Webflow free plan, you should have all the functionalities just that you can't create more than 2 pages or apply the embed (custom code) functionality. You should definitely be able to place a"div" block, just head over to the plus icon on the left hand panel and drag the div component to the canvas or just click on the icon and it will add it as well :) Another way is to quick search cmd + shift + e then type in div and click enter (that is the shortcut way I use) - Derek
I'm very familiar with HTML, CSS, JS etc and I was really hating webflow official tutorials (felt like wasting time), this is exactly what I needed to better understand webflow and how to do all the things I know how to do in code but not on webflow. So simple!
Glad it helped!
Exactly!
yesshh! you're right.. they are just patching things together.. cheating around with padding and stuff and they ignore premise webdesign principles
SAME !!!!! Like just build the damn thing and leave the reasoning for me to deal with 😂😂
This is such an undervalued channel... Your style of tutorial is so freaking easy to follow
Thank you - this means a lot! Glad you found value
Dude you're just amazing, you should upload videos more often you don't have any idea of how much value you bring with these videos
Amazing tutorial, love the focus on teaching and making it straight forward. This didn't feel like 17 minutes.
Great to see you found value and how time just went by. Apprecaite your comment and feedback.
Thank you a lot man! Webflow has a bunch of tutorials but only yours helped me to understand how it works, step by step. Thank you a lot. It would be interesting to see more videos from you!
Thanks glad it helped - if you have any video suggestions please do comment :)
@@dereksiuau Actually it would be interesting to see something practical, how to create and use repeatable components, how to deal with Blog and CMS elements. For me as a beginner, it is super interesting to see how you work, all these hotkeys and other stuff that can come after long use of tool. Thx
Thank you so much for this video! I see a bunch of videos saying that it's better to custom make your own navbar, but no one ever talks about how to make it responsive
Glad you found it helpful!
This video is so much better than the official step-by-step guide. Thank you so much, Derek! I was completely lost before watching this.
Cheers for the kind words, I appreciate it!
Okay, this video is so valuable...it deserves more views. Thank you very much, Derek.
You're very welcome!
Hi derek, pls do you know anything about adding facebook pixels to webflow website? Most youtube videos on that only talks about adding the pixel ID. I want to add PageView pixels to certain pages. This is very very important@@dereksiuau
You're a legend Derek! Its nice to fully understand this at last. I was always using the native one but now my nav bars no longer have to suck! Thanks!
Awesome stuff Alfie! Look forward to seeing what you build!
Just subscribed to say thanks for these amazing tutorials. As everyone else has said these are the best by far, easy to understand, and you show where everything is on the dashboard. Looking forward to more videos!
Thank you for subscribing and the kind words! Looking forward to sharing more videos.
Man I was really struggling to make a nav bar and this tutorial is a gold mine thanks for uploading! Got a thumbs for great work!
Glad I could help! And glad you overcame the struggle.
Searched a few days to find a video like this one. You the only one who teached this right!
Thanks Dave!
There are many ways to do things this is just one way. Just keep that in mind.
Straight to the point! I was able to troubleshoot my own problem on webflow because of this tutorial. Thank you!!
Awesome, must be a good feeling troubleshooting your own problem :)
Just starting out with Webflow & i found this tutorial incredibly informative and helpful. Thank you Derek!
Awesome glad it helped :)
Thanks for the tutorial. I watched it at least twice. Will watch it once more maybe before building my own navbar 😊
Great work Derek! I appreciate this no-nonsense and concise tutorial very much! You explain the reasons behind the decisions, which I find extremely helpful. Looking forward to your upcoming tutorials!
Thanks Saminda,
Look forward to sharing more in the future!
Thank you for your video! Very easy to understand and apply. Following!
Awesome glad it helped Carolina!
wow. your videos are so much better than the content webflow puts out themselves (never clicks with me for some reason). this was so incredibly clear and helpful! thank you so much!
Wow, thanks for this super praise. Appreciate it and glad you found it helpful and easy to understand :)
Truly incredible how well you explain things. Thank you so much for covering this! Exactly what I needed to learn.
@cheese22 Awesome glad you liked my explanation.
Fantastic work. I'm getting a refresh as i haven't used webflow in 2 years. Thank you
Get back on that horse! Hehe
Hey Derek, thanks for the easy tutorial. Much appreciated. You just earned yourself another like and subscriber.
Thanks Sir 🎩
Thank God, you helped me soooo muuch. Love it
I have searched for it, so long how to do this and now i found it. You are the best
Glad I could help! Haha I can relate to your struggle when I first got into Webflow!
Looking forward to seeing your growth and revelations!
- Derek
Thanks man, we are working with Webflow on university, and I wanted to do this so bad! Thanks!
Glad it was helpful! Webflow university is a fantastic tool btw
Great tutorial, keep them going. Was looking for a video on how to create the navbar from scratch and also thank you for showing the essential hamburger button as well.
Thanks! Glad you found the lottie hamburger usefull too!
Best tutorial I found ever!
Wow, thanks!
This was amazing! Thank you so much for taking the time to make this tutorial and explain everything so throroughly.
One small suggestion, IDK if it would also be helpful for others, but I personally am a very visual learner, and webflow can sometimes get confusing, so for me it would help a lot if your navigator was open so that we could see what you're selecting each time.
Great suggestion! Noted. Please note that the layer can also been seen at the bottom right of the screen / corner. But I understand what you are saying.
Thanks for the feedback!
brother thank you so mych this is what I was looking for so long time, very useful and very to the point, thank you, it is amazing explanation, keep uploading tutorials like this man, this is super useful to the point thanks brother
Thanks for the comment brother! Glad you found it helpful.
Thank you ! Im new to web flow and this video answered all questions I had surrounding navbars. I hope you will continue to upload new videos !
Awesome video! My nav is finally sorted after hours of trial and error. Thanks a ton!
Ah yes the hours of trial and error is only sharpening your Webflow skillset keep up the great work!
You explain it very well and easy to understand. keep the fire burning!
Thanks Dennis!
I have done mine. it's perfectly working.
@rakibhossainea Such a great feeling eh :)
Super helpful tutorial, thanks so much! Easy to understand, quick and to the point, great job 🙏
Glad you enjoyed it!
such amazing content man! I really have a better understanding of building custom navigation now :)
Great to hear! Glad you found this insightful and helpful, keep up the great work sir :)
Excellent video, direct and to the point--thank you for sharing!
Great explanation an awesome content. Can't wait to see more Webflow tutorials :)
Thanks - keep an eye out more vid to come!
The Tutorial is really good, thank you! It's important to note that the Navigator panel is not shown in the video, but it's a crucial part of the structure and should be understood, especially by juniors.
Fantastic point noted moving forward.
Great job Derek!
Super awesome tutorial. Not lengthy boring tutorial. Thanks for sharing 😊
Thanks for watching and commenting 🙂
Fantastic! Thank you for this very clear tutorial. Great work. Thanks!
No worries, glad you found it helpful Mike :)
man you are a beast. good job!
Thanks Max, glad you found value.
This was insanely helpful, thank you a ton.
Thanks bro, great tutorial. It was very easy to follow.
What a VIDEO!! Thank you so much man!
Glad it helped!
This is so great and helpful. Thank you very much!
hey man, thank you, great tutorial! wondefully explained and to the point!
Glad you liked it!
Thanks for the video!! Really helpful Derek
Glad it was helpful!
Amazing, thank you so much, you really helped me wrap my mind around how this works.
Great to hear!
Thanks for this, the official webflow tutorial just has you using a prebuilt nav bar.
In my experience learning to use templates without learning the basics leads to poor developers and designers overall
I agree with your statement!
Great tutorial, found this very helpful! 👍
Thanks Joyce
Thank you so much for the great tutorial
You are so welcome!
Amazing explanation, thank you very much. One question left: When i open the menu on my phone, i can scroll in the background... How do i prevent that?
Great question, you can add a custom code that will make the BG (Body) nonscrollable on menu click. Here is a tutorial on that:
th-cam.com/video/k7i2SM_RYRE/w-d-xo.html
damn bro this is super valuable and useful, thank you and mad props
Thank you!
Very good video mate thank you.
Glad you enjoyed it
Thanks for shearing and teaching ;)
Thanks for watching!
Perfect explanation!
Great tutorial keep it up!
Thank you for the video. I'm creating a similar Navbar, but my problem is the Lottie opens on 1st click and closes on 2nd click. After 2nd click it doesn't react. Any ideas what might be wrong?
Is this because your website is a one-page landing page (not multiple pages).
@@dereksiuau That might have been the problem in the beginning. Once I had more pages, I followed your video step by step and now it works! Thank you!!
AWesome!
Thank you so much for the tutorial ❤❤
Thanks, Ajith - Glad you found value!
This was very helpful
dude this was realy good
Glad you liked it
thanks for making the tutorial, never would be able to figure this out on my own. lots of steps to make a simple menu. how would i create a menu item with nested items and show that in the desktop menu and mobile menu?
Glad you figured it out and good to see your mind is turning into a developer even the simplest of navbars takes quite some work to build. Can you clarify what you mean by menu item with nested items - perhaps providing an example?
I can assit better once that has been answered :D
@@dereksiuau yep so I'm talking about having a dropdown menu for the desktop version, and then a slideout menu for the mobile version for a parent menu item. I have "UX Design" as my main menu item, and then I want to list 3 projects underneath that menu item. When I hover it on desktop, it would fade in as a dropdown menu and then when I tapped it on mobile it would slide out.
I figured out how to add the dropdown menu on desktop but I don't know how to convert it to a slideout menu on mobile. I'm also trying to figure out how to fade the dropdown menu in. I selected the dropdown element in webflow, went to interactions and selected "Dropdown menu", and when I set it to fade it also fades out the "UX Design" menu item and the arrow. I don't know how to get it to only fade out the dropdown menu because it doesn't let me select that class specifically. So there's 2 problems here I'm still trying to solve.
Great video, thank you !
You are welcome!
thanks derek
can you pls bring a video in which you tell how should a begginer proced with webflow
This is a great idea I plan to do this in the future so stay tunned.
Thanks for making me understand
Happy to help - thanks for understanding.
This is super excellent ❤
Glad you found value!
thanks for sharing! great resource
My pleasure!
Hi, awesome tutorial, found it really easy/useful Only question I have is... is it possible to create the animation for the Hamburger Menu without using a Lottie Anmiation? Really struggling and just want a static Hamburger menu graphic
Yes sir you can! You can replace the lottie file with a static image or div blocks then animate that.
The lottie essentially has the animation built in so you will just need to create your own using Webflow interactions. Hope that makes sense.
Very good tutorial
Glad you liked it
Thank you so much, this is amazing i was getting irritated not being able to manually code and the presets bring so bare boned
Glad it helped!
very good brother
Thank you so much 😀
that helped so much, thanks!
While I love the official Webflow tutorials, their navbar one only covers to use their prebuilt option instead of teaching you how to build one from zero. Thank you so much for this.
Thank you so much for this. Quick question: how did you get the container within the "section" (the div that you changed to the section class" to be centered and a box? I'm having trouble figuring that out because while it's step by step, it's a little fast and felt some steps were skipped. Thanks so much.
There are many ways to do this, one of the way is to set the container to have auto left margin and auto right margin. Another way would be to set the parent container "section" to flex align centre.
Do you have a video like this but instead of move do opacity?
Hey Jaden, thanks for watching commenting. If you want to do the opacity method just replace the "move" (-100% > 0%) with "opacity" (start: 0% to 100%).
Hope that helps!
I have just tried this, when I make a new div block for container it is full screen, but you have a small block in the middle Do you think Webflow has changed since then?
Based on your description I had the "new div block for container" to have a max width eg. 1650px with 100width and make sure to put the left and right margin to be auto (that is how it will be centred).
So by default everything will be placed on the top right so you have to define it. And no nothing has changed in Webflow haha this is just fundamental HTML / CSS.
I hope this helps :)
- Derek
when i put a section link behind the texts in the nav bar, the nav bar doesnt close.
How can i fix it? Do i have to put an extra animation behind all the text links, so when i klick it, the nav bar closes?
If I understand this correctly, when the navbar is open and user clicks on a navlink you want the navbar to close after the link is pressed, then yes you want to add the animation "Nav Close" to that link.
The reason I didn't do it in the tutorial is because you don't need to close the nav if the links takes you to another page. But if you want it to remain on the page then do the above :)
Hope that helps and thanks for watching.
@@dereksiuau i tried to animate it in different ways with nav closed, „move“ animation, „show/ hide“ animation. But it doesn’t work. This is so essential for my website because if that doesn’t work, the home side is bad :/
really explained nicely👍
How do I make sure that the nav closes and the animation plays whenever a user clicks on a link? Do I have to create a custom animation for every type of interaction?
Great question you can make the close animation once and assign it to affect the class.
So just have the links with the same class and have the interaction affect that class.
I encounter an issue when I open the menu on phone and then scroll down the logo and menu btn both go up with the page. I don't want to make my navbar sticky because it doesn't work with my design... Any solutions?
You could make the menu sticky but not scrollable by using custom code. So when the user taps on the hamburger icon the page (ie Body) is not scrollable.
That is what I can think of immediately. Let me know if you want a tutorial.
Great... but when i click on the nav link the menu icon does not change back to default
I'm assuming your nav link takes you to a section on the page rather than a separate page. If this is the case:
You want to add the "close NAV" interaction to the nav link class.
LMK how it goes!
Excellent Tutorial! I'm confused why your container appears so small when its given a max width of 800px ?
Ahh its because your section class is flexbox with settings applied hehe ! I'll leave this for anyone else questioning this
@@Sheenabeepboop Nice glad you found the reasoning yourself - that is the trait of a developer ;)
Awesome vid! Thanks a lot!
Glad you liked it!
You're a legend
Please keep the Navigator bar open while you work, it would make it so much easier to follow along
Noted! - Thanks for the feedback.
Wonderful. Pleas more. Thank you
mate... LEGEND
Thanks for watching MATE!
Lifesaver honestly. I’m here chanting SIUUUUU everywhere I go 👊
Bro amazing video
Thanks
@dereksiuau: How have you been able to add elements via search shortcuts in NAV Div? Kindly add shortcuts instruction also, it may become easier for the users to index all elements. Thanks for the help.
Command (or Control) Shift E - opens up quick search.
Then you can type what you want eg. Div then hit enter. Tat is what I typically do.
Extra tip: I hit Command (or control) space to write a class.
- Derek
@@dereksiuau Thanks a lot, Derek 🫡
Great job, THX
Thanks for watching and commenting!
Fantastic
Cracking video. Thank you.
Thanks for the cracking comment!
amazing!
Thank you! Cheers!
Siu. How do you that amazing video background with words on top?
Are you referring to a Webflow site? Or you referring to the video itself where it has the text moving?
Please advise, perhaps send me timestamps
hello! How do you close the navbar once the user clicks on a link on mobile?
Hey Lisa, you want to put the "Close Nav" interation to the nav links.
@@dereksiuau would this be on the first or second click? I've tried apply9ing close nav but the animation doesnt seem to work on the links
@@lisayang9538 Yeah that's exactly the problem I noticed as well. Without the Option to tell webflow options like nav open / nav closed. You're stuck with first/second click option. Even if the links play the Menu Close animation, your next click on the menu will do nothing, because the lottie is already at zero and the menu closed, having you to do another click
@@lisayang9538 First click.
@@saschatribula2650 I see what you are trying to say, this happens in unique situations like a one-page landing page with links scrolling to the page sections. Do you have any suggestions to over come this?
Nice Video! I have a question, if i click on any nav link in mobile view, the nav menu refuses to close, I have to tap on the hamburger again for it to close, how can I fix that?
You will need to add the "Close Nav" interaction to the nav link (ideally class so it affects all of them).
Let me know!
How are you doing the search just by clicking in the section? I can’t figure that out
You mea the quick search? Which is CMD (or Control on Windows) + E
If this isn't it, please send me timestamp of the video and I'll let you know :)
Hey Derek, fantastic video but one question. Everything is working great but the navbar only seems to render at like 60% of the viewport (and the logo scrunches up to half width when you scroll) on iphones. It works normally in the web viewer and on android. Any idea what I might have done wrong? Thanks again and great work!
I suspect the logo is not rendering properly on iphone because it does not have a defined height and width - if filled in blank it can cause issues on IOS so make sure to at the very least have "auto" on any undefined height or width.
Let me know if that works. As for the navbar rendering 60% of the viewport - make sure that on Webflow go to the smallest breakpoint on mobile 320px and make sure all the items fit the nav and doesn't go over.
- Derek
Awesome !
Thank you so much!
Glad it helped!
I am new to webflow and was wondering what is the shortcut for adding the "div" I am unable to edit the code directly is it because of the plan I have?
With a Webflow free plan, you should have all the functionalities just that you can't create more than 2 pages or apply the embed (custom code) functionality.
You should definitely be able to place a"div" block, just head over to the plus icon on the left hand panel and drag the div component to the canvas or just click on the icon and it will add it as well :)
Another way is to quick search cmd + shift + e then type in div and click enter (that is the shortcut way I use)
- Derek