-
AuthorPosts
-
June 7, 2017 at 2:45 pm #805092
My client wants to use the navbar on top (not the main menu) How do I enable that menmu to operate as the main menu for mobile? Right now the main menu icon is blank because I am not using it. (Can the main menu be used as a top navbar?)
Also, my two items (The phone number image and the quote image) are not stacking below the logo-they are over lapping somewhat. How do I fix this?
http://www.edgestoneworks.com/home-bu/
Thank you,
Mike
- This topic was modified 7 years, 6 months ago by johnworfin.
June 7, 2017 at 4:34 pm #805143Hey johnworfin,
Add the following to to quick css:
#advanced_menu_toggle{ display:none!important; } @media only screen and (max-width: 767px) { .inner-container{ margin:0 15%!important; padding-bottom:130px!important; } #header #text-2{ left:0px!important; margin-left:50%!important; margin-top:25px!important; } #header #text-6{ left:0px!important; margin-left:3%!important; margin-top:100px!important; } }
This should take care of much of your issues.
Best regards,
Jordan ShannonJune 7, 2017 at 4:37 pm #805147It looks better on mobile-but now in a normal browser windows on a computer-the page looks to narrow and some elements in the header overlap.
Any ideas?
Thank you,
JW
June 7, 2017 at 4:41 pm #805149Hi,
If you remove the css does it go back to normal?
Best regards,
Jordan ShannonJune 7, 2017 at 4:42 pm #805151If I remove the CSS you provided it looks fine on a computers browser window, but the two elements are overlapping on mobile and not stacking.
JW
June 7, 2017 at 4:43 pm #805154Hi,
Try just removing this portion:
#advanced_menu_toggle{ display:none!important; }
Best regards,
Jordan ShannonJune 7, 2017 at 4:44 pm #805155Hi,
And see if it goes back to normal on desktop
Best regards,
Jordan ShannonJune 7, 2017 at 4:46 pm #805159Just removing the toggle makes the site way to thin again. And I want that menu removed for mobile
JW
June 7, 2017 at 4:59 pm #805171I had to remove that code because it made the site way too thin on normal computer browsers. Any idea how to keep the width how it is set currently, but the two elements stack properly on mobile devices?
Thx,
JW
June 7, 2017 at 5:02 pm #805174Hi,
Would you be able to provide admin info so I can look into the issue further?
Best regards,
Jordan ShannonJune 7, 2017 at 5:08 pm #805178Info below
June 7, 2017 at 8:46 pm #805282Hi,
I added the css I shared to the very top of quick css and it seems to work. Please check as this means something below it either needs to be removed or is structured wrong.
Best regards,
Jordan ShannonJune 7, 2017 at 8:47 pm #805284Awesome-thank you so much! I will look into the other css that needs to be removed.
JW
June 7, 2017 at 8:48 pm #805285Hi,
Great!
Best regards,
Jordan ShannonJune 7, 2017 at 8:50 pm #805286It has to be this underneath:
#header #text-2 { left: 50%; padding-top: 10; position: absolute; top: 0; transform: translate(-50%); z-index: 999; } #header #text-6 { left: 73%; padding-top: 10; position: absolute; top: 0; z-index: 999; }
June 7, 2017 at 9:17 pm #805299Hi,
I see. Does that need to be in there?
Best regards,
Jordan ShannonJune 7, 2017 at 9:19 pm #805303When I remove those, the layout gets screwed up…I’m sure there is a line or two that needs to be adjusted-just not sure which ones(s)?
JW
June 7, 2017 at 9:29 pm #805309Hi,
Try adding “px” under your padding-top rule.
Best regards,
Jordan ShannonJune 7, 2017 at 9:34 pm #805312WOW-how in the heck did I miss that. Unreal-thank you so much!
JW
June 7, 2017 at 9:36 pm #805315Hi,
No problem at all.
Best regards,
Jordan Shannon -
AuthorPosts
- You must be logged in to reply to this topic.