Centering main menu, phone number stacking in action bar and overall responsiveness questions
OK I have a few questions:
Here is the site I am working on: http://knowledgeforprofit.com/activaided/
1. In the orange Action bar: sometimes the phone number stacks and looks quite odd but then upon refresh it sometimes corrects itself. How can I fix that so it will never stack? See screenshot below: --> https://www.dropbox.com/s/idcdf0uuaqqevkx/phone stacked.jpg?dl=0
2. I need to make the main menu centered and equally spaced from left to right. I also need to make the background of the menu a certain color.
3. When the screen size shrinks, the main nav goes into mobile responsive menu way to soon. I need to make sure that it ONLY goes to mobile mode when below 750px or the size of an iPad in portrait mode.
4. When in the smallest window size or on a mobile phone, the orange action bar disappears and is just white. How can I keep the orange background indefinitely?
I think that is it for now, thank you!
Comments
1. When exactly this happen? Because we checked this on our side and all works fine.
2. You can center menu only if you will remove cart from header. More details about this you can read on http://forum.muffingroup.com/betheme/discussion/170/any-suggestion-how-to-center-menu-using-stack-center and when you will do this, we'll be able to give you css to set background color.
3. You can change the moment when menu turns into responsive of course. More details about this you can read on http://forum.muffingroup.com/betheme/discussion/29/responsive-toggle-value
4. You can do this with below css:
.header-stack #Action_bar {background-color: #ff5900 !important;
}
2. To change background color for menu, please use below css:
#Top_bar #menu { background: #000 !important; }But you can't unfortunately stretch background color the same way as action bar because the header is wrapped into wrapper which got fixed width.