correct way to move nav via css for different browser sizes
Posted 16 June 2012 - 04:04 PM
I've made this css change to move the nav bar next to the logo which looks great on desktop but when I checked on my ipad and iphone it was a massive fail.
Does anyone have a tip on the "proper" way to to do this so that it doesn't get all wacky on mobile devices.
I need the navigation to look like this:
The way I imagine the nav working on smaller width is for it to "stack" neatly underneath the logo. Is this possible?
I have an under construction page up now so you can't view the site live unless logged in but you can login to view with a subscriber account i've set up temporarily.
Thanks so much!
Posted 16 June 2012 - 04:17 PM
Posted 16 June 2012 - 06:42 PM
Posted 16 June 2012 - 06:47 PM
The plugin actually adds new classes to the main body tag in the html of your page, so if your viewing the page on a PC in chrome, it adds desktop chrome to the tags, if your on an iphone it adds iphone, it supports all major browsers and mobile/tablets. This makes it possible to target these browsers in your custom css.
Basically, you just have to use the new classes that are added to target the elements that you want to change. (i.e. if you want to make a text color adjustment for the iPhone, you'll use the iPhone class and the text color attribute, "color: #XXXXXX;")
Posted 17 June 2012 - 10:35 PM
Posted 17 June 2012 - 10:43 PM
Posted 21 June 2012 - 10:19 PM
Posted 22 June 2012 - 02:20 AM
Posted 11 July 2012 - 05:10 PM