Viewing 30 posts - 1 through 30 (of 31 total)
1 2
  • Author
    Posts
  • February 11, 2017 at 3:14 am #745674
    jamesf1989

    Hey,

    1) I’ve managed to get the footer menu centered and where I want it to be positioned. However when I shrink the browser window, it disappears completely.

    Here’s my code in the Quick CSS:

    .big-preview {display:none;}
.main_color strong {color:#666666;}
.sidebar {padding-top:10px;}
@media only screen and (max-width: 1140px) {
.av-main-nav > li > a { padding: 0 7px; }}
@media only screen and (max-width: 480px) { 
.responsive .logo a, .responsive .logo img {
max-width: 90%;
height: auto !important; }}
.main_color strong {color:#111111;}
.post-title .entry-title {font-size:26px;}
.entry-content-wrapper .post-title {font-size: 26px !important;}
#socket .sub_menu_socket div {overflow:auto;width: 750px; margin: 0px auto;}
#socket .sub_menu_socket {float:none;margin-top:35px;}

    How do I get it to show the menu items centered over multiple lines?

    2) Also, my main top menu overlaps my logo when I shrink the browser window. How do I turn it into the mobile menu sooner?

    Thanks!
    – James.

    • This topic was modified 7 years, 2 months ago by jamesf1989.
    February 13, 2017 at 1:39 am #746080
    jamesf1989

    Can anyone help?

    Thanks,
    – James.

    February 13, 2017 at 5:55 am #746115
    Rikard

    Hi,

    Could you post a link to the site in question so that we can take a closer look please?

    Best regards,
    Rikard

    February 13, 2017 at 2:04 pm #746393
    jamesf1989

    Sure – it’s at http://www.digitalprosperity.com .

    Thanks!
    – James.

    February 15, 2017 at 5:12 am #747258
    Rikard

    Hi James,

    1. Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 767px) and (min-width: 480px) {
.responsive #socket .sub_menu_socket {
    display: block;
}
}

    2. Set your mobile menu to be displayed for tablets as well under Enfold->Header->Mobile Menu

    Best regards,
    Rikard

    February 16, 2017 at 2:39 pm #747966
    jamesf1989

    Thanks for that Rikard! The top menu is now fixed, but the footer menu still disappears and doesn’t wrap to new lines when the window is resized. See here: http://www.digitalprosperity.com .

    Any help?

    Thanks,
    – James.

    February 18, 2017 at 1:50 am #748732
    jamesf1989

    Any help?

    Thanks,
    – James.

    February 20, 2017 at 10:02 pm #749614
    Yigit

    Hi,

    Sorry for the late reply!

    Please refer to this post – http://kriesi.at/documentation/enfold/display-footer-menu-scroll-to-top-button-on-mobile/

    Best regards,
    Yigit

    February 20, 2017 at 10:06 pm #749620
    jamesf1989

    Thanks – but the footer still doesn’t wrap the menu items onto a new line when the window is resized. Any help with that?

    Thanks,
    – James.

    February 20, 2017 at 10:14 pm #749622
    Yigit

    Hey!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (max-width: 768px) {
#socket .sub_menu_socket div { width: auto; }}

    Cheers!
    Yigit

    February 20, 2017 at 10:29 pm #749632
    jamesf1989

    Thanks Yigit, but this didn’t do anything. See the footer here: https://www.digitalprosperity.com .

    Thanks,
    – James.

    February 20, 2017 at 10:32 pm #749634
    Yigit

    Hey!

    Can you please create a temporary admin login and post it here privately so we can look into it?

    Regards,
    Yigit

    February 20, 2017 at 11:24 pm #749658
    jamesf1989

    Sure! Please see the temporary login details in the private content section of this reply.

    Thanks,
    – James.

    February 21, 2017 at 12:18 pm #749892
    Yigit

    Hi,

    I made a slight change on the code. Please flush browser cache and review your website

    Best regards,
    Yigit

    February 21, 2017 at 3:53 pm #750017
    jamesf1989

    Thanks but now that’s created another problem… There’s a scrollbar for the menu items, it’s all left aligned when I want it all to be centered and the line height needs to be bigger so the links don’t overlap. How would we accomplish this?

    Thanks!
    – James.

    February 26, 2017 at 2:16 pm #751936
    Vinay

    Hi,

    I do not see any scrollbar for the menu items.

    To center align menu items please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    
@media only screen and (max-widht:767px) {
	#socket .sub_menu_socket li {
	        float: none!important;
	}
	#socket .menu {
	    text-align: center;
	}
}

    It should look similar to

    Best regards,
    Vinay

    • This reply was modified 7 years, 1 month ago by Vinay.
    February 26, 2017 at 3:31 pm #751955
    jamesf1989

    Thanks for this Vinay, although after adding this code, the menu items are still left aligned. See here:

    Left aligned menu items

    They’re also wrapped around the social images.

    Anything else I should add to fix this?

    Thanks,
    – James.

    February 26, 2017 at 4:40 pm #751969
    Vinay

    Hi,

    I have added the code in media query to affect only on mobile scree and confirm that the code works fine. You may not see the changes until the cached files are cleared in your browser.

    Please try to hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload” and review the site again.

    Best regards,
    Vinay

    February 26, 2017 at 7:23 pm #752001
    jamesf1989

    Thanks for this Vinay, although that’s still not fixed it 100% and also introduced another problem.

    I’ve recorded a quick video to show you what I mean (make sure your sound is on): https://youtu.be/3vTlp9EUjkA.

    (Or alternatively how to center align everything in the footer just for the mobile view, as that way it won’t overlap.)

    Thanks!
    – James.

    • This reply was modified 7 years, 1 month ago by jamesf1989.
    March 4, 2017 at 6:56 pm #755658
    jamesf1989

    Any help? As it’s been almost 6 days now…

    Thanks,
    – James.

    March 9, 2017 at 7:35 pm #758501
    Basilis

    Hey!

    I loaded the web site with my iOS And I can see the menu proper, like how Vinay said it is working.
    You most probably under cache.

    Regards,
    Basilis

    March 9, 2017 at 8:39 pm #758537
    jamesf1989

    I’m viewing the website in Incognito mode, meaning it doesn’t save a cache or any temporary files.

    Did you watch the video I recorded for you, which explains what I’m referring to? It’s at https://youtu.be/3vTlp9EUjkA . As I noticed you didn’t answer the other question in there too, about the articles section.

    Thanks,
    – James.

    March 10, 2017 at 7:18 pm #759089
    Basilis

    Hey!

    One by one the issues, else we can not solve them properly.

    @media only screen and (max-widht:767px) {
.responsive #top #wrap_all .container {
text-align: center !important;
} }

    Let us know if that one works out as should.
    Thanks a lot

    Regards,
    Basilis

    March 10, 2017 at 9:30 pm #759132
    jamesf1989

    Ok I’ve just done that (changing the typo of “widht” to “width”). What’s next?

    Thanks,
    – James.

    March 12, 2017 at 9:36 pm #759709
    Basilis

    Hi!

    Actually, as I was on the same topic I took the code from Vinay,
    So

    @media only screen and (max-width:767px) {
	#socket .sub_menu_socket li {
	        float: none!important;
	}
	#socket .menu {
	    text-align: center;
	}
}

    I fixed his type also, can u try again?

    Regards,
    Basilis

    March 13, 2017 at 12:53 am #759762
    jamesf1989

    Ok I just did that – thanks. What’s next?

    Thanks,
    – James.

    March 13, 2017 at 8:56 pm #760241
    Basilis

    Hey!

    And what is the result?
    What is working, what is not, what is missing?
    Would be perfect to help us – help you.

    Cheers!
    Basilis

    March 13, 2017 at 10:14 pm #760286
    jamesf1989

    Everything looks pretty similar to what I showed you in the video…

    1) The articles grid below “Check Out Our Latest Articles” at https://www.digitalprosperity.com still isn’t showing on the user’s first page load (meaning they have to refresh the page to see it).

    2) The bottom menu still has a vertical scrollbar when the window is resized, and also the two top links get pushed to the side when the window is resized even smaller.

    Can we get these fixed please?

    Thanks,
    – James.

    March 14, 2017 at 5:26 pm #760870
    Basilis

    Hey!

    1. The latest articles load when user scrolls, so they do load properly, but they might not be triggered so fast you want.
    2. I do not see the code we asked, you have not entered it at all.

    Also, please:

    1. Please disable cache most probably the loading issue will be fixed properly
    2. Updated to latest Enfold Version

    Best regards,
    Basilis

    • This reply was modified 7 years, 1 month ago by Basilis.
    March 14, 2017 at 6:10 pm #760896
    jamesf1989

    Hey Basilis,

    I’ve updated the theme to the latest version AND turned off the cache plugin, and when seeing the home page for the first time in an incognito window (i.e. with no cache), the articles area still doesn’t show at all. It’s not a matter of it being slow, it’s that it doesn’t display however long I wait and however many times I scroll past it. See for yourself in an incognito window here: https://www.digitalprosperity.com .

    I also did enter the code, but maybe the cache plugin was stopping it from showing up for you. Please check again.

    Thanks,
    – James.

  • Author
    Posts
Viewing 30 posts - 1 through 30 (of 31 total)
1 2
  • You must be logged in to reply to this topic.