Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • January 31, 2014 at 6:19 pm #217568
    paulseager

    How can I accommodate a larger logo in the header and alter the navigation to push it further down the header section to balance the design. I have managed to alter the logo depth by following another thread… but I cannot see anyone asking to move the navigation down in line with the increased depth. I can show a screen shot as to what I have achieved so far…if this explains better?

    February 1, 2014 at 11:45 pm #218301
    Josue

    Hi Paul!

    Post the screenshot of what you want to achieve, also a link to the website will be helpful.

    Best regards,
    Josue

    February 2, 2014 at 1:45 pm #218399
    paulseager

    The issue I have is that the navigation is very high in the header section… please see my screenshot
    Header navigation needs to be lower please

    February 2, 2014 at 6:24 pm #218444
    Josue

    Hi,

    Can you post the link to your website please?

    Regards,
    Josue

    February 2, 2014 at 8:30 pm #218497
    paulseager

    Hi – I am sorry but as I am developing this theme locally – I cannot send a link to the live site. I have run into a problem though with the current depth fix that I thought I had sorted. I decided as I would be making a few alterations I had better make a child theme and put my CSS code in there rather than use the quick fix method. Although I found that the breadcrumb area is now not deep enough? Almost like the alteration I made in JS – avia file on line 918 (to allow for the deeper logo) is not having the same result as previous?

    February 2, 2014 at 9:23 pm #218511
    Josue

    Hi!

    Could you please detail what alterations have you made (CSS and JS) so i can try to reproduce it on my local installation.

    Best regards,
    Josue

    February 2, 2014 at 9:47 pm #218515
    paulseager

    CSS:

    .logo, .logo a, .logo img {
    height: 120px!important;
    }

    .fixed_header.social_header #main {
    padding-top: 120px;
    }

    avia JS file Line 918:
    el_height = $(elements).filter(‘:first’).height(130),

    February 3, 2014 at 12:14 am #218534
    Josue

    Hi!

    Regarding the first request (Menu), try with this CSS:

    .main_menu {
    top: 16px !important;
}

    This will fix the breadcrumb issue:

    #main {
    padding-top: 160px !important;
}

    Cheers!
    Josue

    February 3, 2014 at 9:55 am #218684
    paulseager

    These fixes work fine on the expanded desktop view – but unfortunately create a 160px distance between the navigation and main content when viewed at compressed (mobile) screen size…. nearly there! Sorry

    February 3, 2014 at 1:01 pm #218757
    paulseager

    Would I be best using a Child theme or using the custom CSS file that you supply? I only ask because your fixes work brilliantly in when added to the Custom CSS file, but I don’t want any updates to remove these custom overwrites in the future?

    February 4, 2014 at 9:29 am #219228
    Dude

    Hey!

    I recommend to place the code into the child theme style.css. Try to wrap Josues code into a media query

    
@media only screen and (min-width: 767px){
.main_menu {
    top: 16px !important;
}

#main {
    padding-top: 160px !important;
}
}

    to use the default css code on mobile devices and the custom css code for the desktop view.

    Best regards,
    Peter

    February 4, 2014 at 11:06 am #219274
    paulseager

    All fixed. Thanks again for your support. I will continue to promote your theme! Good work.

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘How do I accommodate a larger depth logo in the header’ is closed to new replies.