Tagged: enfold, header, menu, Responsive Menu, top menu
-
AuthorPosts
-
June 7, 2015 at 7:57 am #455591
Hello team Kriesi,
I just upgraded my copy of Enfold (long overdue, from 2.4 to 3.1), and am running into a few issues, that I am hoping to resolve ASAP, since the changes are live, and are pretty immediately noticeable. My website is:
Problem 1: On my homepage’s top menu, please see the last item, contact. The roll-over state background color (white) is cut off on the right edge of the word, just as it is for “home” under the blog area.
I had had an issue with the spacing/padding on those rightmost menu items before, and had solved via some suggested quick css, I believe. Those don’t seem to be working after the update now.
Problem 2: Squeezed header/logo image.. after the update, my logo started to appear stretched vertically, and I’m also running into overlap with the menu items. I will look into reloading my image at a narrower size, and seeing if any clash with old quick css line may be causing this after the update.
Problem 3: While I’m on menu related questions, since I am now finally using the responsive layout, I was wondering if there is a way to keep the responsive menu locked/fixed and visible at the top no matter what. I noticed once I scale the browser window to a certain size, the top menu will scroll with the rest of the page.
I have some other responsive web issues I will try tackling too. I know my top slider has elements that were designed at fixed sizes and positions that are now out of wack, which is completely my fault. I need to use em unites throughout, I assume? I would appreciate any advice.
Thanks!
Omar
June 7, 2015 at 9:24 am #455602Hey ramirezo!
Thx a lot for using our products.
Can you please show us the code you are using for 1?2. I see the logo issue, as fixed.
3. I also tried the web site on my iPhone and I do not see the menu rolling, so I guess you are ok there also?
Let us know any other issues.
Regards,
BasilisJune 9, 2015 at 2:20 am #456410Hello Basilis,
Thanks for the response!
The quick css code I added for the first item on my list a ways back was:
#top .main_menu .menu>li:last-child>a {
padding-right: 13px;
}Don’t know if that helps. The black space I’m getting on edge of the menu items in question does seem to correspond with that, but the white of the over state is butting up right against the right end of words.
For item 2, I was able to fix the logo issue by resizing the image and removing a line I had in the quick css relating to the logo size.
For item 3, sorry, I think my request was awkwardly worded, since I think you understood the opposite of what I meant. I want to keep the menu from scrolling away and out of frame in the condensed/mobile view. I think you guys built it to behave like that by default for good reason, since screen space is limited in the smaller form factor of mobile devices, but I want to at least try it out, since in my case, I think it may work with the one page page layout I have for my main/home page that houses most of the content.
Thanks!
Omar
June 9, 2015 at 7:37 am #456478The main menu over state background issue strangely corrected itself when I toggled on the top menu search function in the Enfold settings. However, the search option didn’t become visible.. which I can live with, but I would be curious to know how to bring it in if possible.
June 9, 2015 at 7:51 am #456486It looks like I solved item 3 with this: https://kriesi.at/support/topic/how-to-fix-spacing-on-mobile-sticky-menuheader/
June 9, 2015 at 7:58 am #456490So I have kind of achieved what I wanted from item 3 in my list, but I noticed the main menu bar height is actually growing taller in the mobile view, when I actually want the opposite to occur (I want it to shrink as small as possible while remaining usable). Any suggested code or setting changes for achieving that?
thanks!
Omar
June 10, 2015 at 5:18 pm #457385Hey!
I can’t see that it’s growing. For me it stays with the same height all the time. Do you want to make it smaller? if yes use this code:
#header_main { padding-top: -33px; } .inner-container { position: relative !important; top: 14px; }
and adjust as needed.
Cheers!
Andy -
AuthorPosts
- You must be logged in to reply to this topic.