Reputation: 25
I was wondering if its okay to create 2 different navbars on the same HTML file. I mean, I already have one that I built for Mobile Media Query, but I'm not sure if I can transform the same code using CSS and JS to a Computer media query.
I think it won't be ok if I have 2 different navbars and I just display none one of them depending which query I'm using...
Upvotes: 0
Views: 36
Reputation: 2414
The general approach is that you have ONE navbar. You then use CSS to control what happens in Desktop view and what happens in mobile view. You have media queries for that as you pointed out yourself.
There are quite a few reasons to this. One of the first learning steps to programming is that redundancy is bad. It may not harm you much in small, personal projects, but imagine large scale applications where you have to jump from file to file, section to section only to copy paste the same changes, or make changes to the same element in your application. It becomes tedious really fast and is just begging for human error to occur really.
My advice:
-Less is more.
-Think twice, code once.
Don't go for redundancy in your solution, even if it seems more simple to you now. It's a bad habbit and best fixed early on.
With that said, there are tools out there that can save you a lot of time and make your job generally a lot easier when it comes to responsive web development. One of the more popular ones is Bootstrap. Using a CSS framework, or a JavaScript library, is not a bad thing. No need to invent the wheel twice. Let the CSS frameworks handle the responsiveness and then you can focus on the other styling, or tweak the responsiveness where needed. It's a lot less work.
Upvotes: 1