Tagged: , ,

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #1074869
    #1074871

    Help would be awesome thanks!

    #1075357

    Hi adaptiveseosolutions,

    Can you give us a link to your site? so we can try to inspect it and check further.

    Best regards,
    Nikko

    #1076294

    I would like to make the logo bigger in size as well as have the logo appear above the top header (in front of it) so the logo is showing completely.

    Can this be done?

    #1076297
    This reply has been marked as private.
    #1077636

    Hi adaptiveseosolutions,

    Thanks, can you try adding this css code in Quick CSS, located in Enfold > General Styling:

    #header .logo {
        overflow: visible;
    }
    
    #header .logo a, 
    #header .logo img {
        min-height: 150px;
    }
    
    @media only screen and (max-width:767px) {
      #header .logo a, #header .logo img {
        min-height: 80px !important;
      }
    }

    Best regards,
    Nikko

    #1081202

    Hi there, I have added the code and that has made it a bit nicer on mobile but I still want some changes on the desktop.
    I would like the logo to appear slightly in the top header as well. Also I would like if the top header did not disappear on desktop when you scroll down.

    It is important we keep the logo looking nice but also within the top header as well and visible.

    Website

    #1081403

    Hi adaptiveseosolutions,

    Try adding this code as well:

    #top #header #header_main {
        z-index: 11;
    }
    
    #header .logo {
        margin-top: -15px;
    }

    Best regards,
    Nikko

    #1083331

    Thanks that got the logo to move up slightly into the top header. This is my current coding for everything. What can I alter to make my logo even bigger JUST on desktop?

    .logo ,.logo a,.logo img {
    min-height: 120px;
    }

    #top .avia-button-fullwidth .av-button-description {
    font-size: 12px; }

    .avia-button-wrap span.avia_iconbox_title {
    font-size: 18px;
    }

    #header .logo {
    overflow: visible;
    }

    #header .logo a,
    #header .logo img {
    min-height: 150px;
    }

    @media only screen and (max-width:767px) {
    #header .logo a, #header .logo img {
    min-height: 80px !important;
    }
    }

    #top #header #header_main {
    z-index: 11;
    }

    #header .logo {
    margin-top: -15px;
    }

    #avia-menu .avia-menu-text {
    font-size: 17px !important;
    font-weight: bold !important;
    }

    Thanks for the reply!

    #1083380

    Hi adaptiveseosolutions,

    You just need to adjust the minimum height in this code:

    .logo ,.logo a,.logo img {
    min-height: 120px;
    }

    Best regards,
    Nikko

    #1083600

    The Desktop Logo and header looks good now. But making these changes has affected how the mobile header looks negatively.

    As you can see in this image the green mobile header section isdouble the size of the logo now. How can we fix this so it looks more presentable on mobile without affecting the desktop.

    The website link is below:

    This is my current coding

    .logo ,.logo a,.logo img {
    min-height: 170px;
    }

    #top .avia-button-fullwidth .av-button-description {
    font-size: 12px; }

    .avia-button-wrap span.avia_iconbox_title {
    font-size: 18px;
    }

    #header .logo {
    overflow: visible;
    }

    #header .logo a,
    #header .logo img {
    min-height: 150px;
    }

    @media only screen and (max-width:767px) {
    #header .logo a, #header .logo img {
    min-height: 80px !important;
    }
    }

    #avia-menu .avia-menu-text {
    font-size: 17px !important;
    font-weight: bold !important;
    }

    #1083914

    Hi adaptiveseosolutions,

    Can you try including this code:

    @media only screen and (max-width:767px) {
      #top #header #header_main, 
      #top #header #header_main .av-logo-container, 
      #top #header #header_main .inner-container, 
      #top #header #header_main .logo {
        max-height: 100px;
      }
    
      #top #header #header_main .logo {
        display: block;
        padding-top: 10px;
      }
    }

    Best regards,
    Nikko

    #1088940

    Hi Nikko that did not change the mobile header at all and it still occupies a large amount of space on the phone. Is there a way I can send you the photo that you can see it?

    https://www.dropbox.com/s/sc6yit0mzydfioy/55439737_337128290484262_553679743254265856_n.jpg?dl=0

    I have pasted a link that shows the mobile view on my phone.

    As you can see the green is almost double the size of the actual logo and taking up so much space.

    I would like the green backing to be almost the same height as the logo so it takes minimal space on mobile but does not change how our desktop view is looking.

    Thanks!

    Nathan.

    #1089387

    Hi Nathan,

    Can you try to clear the browser cache? I have checked it with my mobile phone and it looks great (screenshot in private content).

    Best regards,
    Nikko

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