Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • May 8, 2018 at 1:09 pm #953352
    jcompter

    Hello,

    The Enfold theme offers a number of layouts to position the menu, but there’s one I’m actually missing. That is “Menu Top, Logo Left”.
    I’ve tried several changes in the CSS to get the logo positioned on the left but just can’t succeed. Hopefully you can help me out to get it done.
    I would also like to have the logo to be displayed completely. It now doesn’t show the right top part of the logo. The right top corner is now covered behind the menubar. I thought resizing the logo would solve the problem, (making it smaller) but that didn’t help. Do hope you can help me out with the proper CSS code.

    Thanks in advance

    May 9, 2018 at 7:56 am #953740
    Rikard

    Hey jcompter,

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

    .av-section-bottom-logo {
  margin-top:30px;
}

    Best regards,
    Rikard

    May 9, 2018 at 10:32 pm #954175
    jcompter

    Hi Rikard,

    Thanks for your attempt to solve my issue. Sorry to see it didn’t help. It even made it worse and only would solved just one part of my issue.
    Instead of lowering the image it lifts up the logo. And also does not place the logo to the left
    Before submitting my ticket I also tried your suggestion combined with my wish to have the logo left aligned. I used the following css code. Which in my opinion should work, but does not.:

    .av-section-bottom-logo {
    float: left;
    margin-top:40px;
    }

    May 11, 2018 at 4:33 am #954987
    Rikard

    Hi,

    Thanks for the feedback, though I’m unsure of your intentions now. Do you want the logo to be inline with the menu? If so, I’m not sure if that would be possible.

    Best regards,
    Rikard

    May 11, 2018 at 2:31 pm #955306
    jcompter

    Hi Rikard,

    I do apologize if I confused you. What I actually want is quite simple.
    I wish to have the menu on top, the logo beneath the menu positioned to the left and displayed in full details.

    The theme now offers the option “Logo center, Menu above” which I selected to get the menu on top.
    I regret there’s no option “Logo left, Menu above” then I would have been finished. Now giving me lots of headaches.

    May 12, 2018 at 8:28 am #955604
    Rikard

    Hi,

    Thanks for the clarification, I’m still not sure if I understand exactly but I think I do. You have this code CSS in a CSS file which seems to be served by a caching plugin:

    .av-section-bottom-logo {
    float: left;
    margin-top: 30px;
    max-width: 250px;
}

    If you remove the max-width argument then your logo should look much different.

    Best regards,
    Rikard

    May 12, 2018 at 8:29 am #955606
    Rikard

    Hi again,

    If you have a mock-up or screenshot highlighting your intentions then it’s easier for us to understand what you are looking to achieve.

    Best regards,
    Rikard

    May 12, 2018 at 9:30 am #955639
    Guenni007

    but i guess you only have to do the margin-bottom on wider screens. When hamburger appears you should erase that rule
    or you set it directly only for screens wider than your nav break point f.e.
    i have on my installation test site a header_meta with phone and social bookmarks 

    @media only screen and (min-width: 990px) {
	.av-section-bottom-logo {
	    margin-top: 30px !important;;
	}
}

    by the way did you have any mega-menu in your navigation?
    what does drop down area do and look like just before burger starts to be visible? Is the left position of it calculated well?
    i can not say that my testpage is representative for it. because my functions.php of child-theme has f.e. 840 lines ! and css is full of spcialised rules for different pages – so maybe there is something disturbed for right behavior – but see my example page for you:
    https://webers-testseite.de/logo-left-menu-top/

    • This reply was modified 6 years, 7 months ago by Guenni007.
    May 13, 2018 at 1:16 am #955922
    jcompter

    Hello Guenni007 and Rikard,
    The test website Guenni007 showed us was exactly what I had in mind. Nothing fancy, just the logo displayed to the left and displayed in full size.
    Thanks to Guenni007 I’ve managed to solve the issue by adding the following code to the custom CSS:

    @media only screen and (min-width: 990px) {
    .av-section-bottom-logo {
    margin-top: 30px !important;;
    }
    .html_header_top.html_logo_center .logo {
    left: 15%;
    }
    }

    May 13, 2018 at 6:49 am #955943
    Rikard

    Hi,

    Great, glad you got it working and thanks for sharing your solution. Thanks again @guenni007 for helping out :-)

    Best regards,
    Rikard

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