Okay
  Public Ticket #1301735
logo center
Closed

Comments

  • SofaandMore started the conversation

    Hi,

    Can you provide me the CSS code to center the header logo at the middle of the navigation buttons.

    Kind regards.

  • [deleted] replied

    Hi SofaandMore

    Please consider first to read the article How to add Custom CSS to your site, then pas the code below on Custom CSS section

    header.main-header .logo-and-menu-container {
        display: block;
       
        margin: 0 auto; 
        text-align: center;
    }
    header.main-header .logo-and-menu-container .logo-column{
        display: block;    
        margin: 0 auto;
        width: 140px; /* this depends on logo width */
    }
    header.main-header .logo-and-menu-container .menu-column, 
    header.main-header .logo-and-menu-container .mobile-menu-column,
    .main-header.menu-type-standard-menu .standard-menu-container{
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    

    Thank you.

  • SofaandMore replied

    Not working just zoom in on the navigation buttons logo

  • SofaandMore replied

    give these warnings

  • [deleted] replied

    Hi

    Please remove the previously pasted code and paste it again since we made some changes to it, now it should work.

    header.main-header .logo-and-menu-container {
        display: block;
       
        margin: 0 auto; 
        text-align: center;
    }
    header.main-header .logo-and-menu-container .logo-column{
        display: block;    
        margin: 0 auto;
        width: 140px; /* this depends on logo width */
    }
    header.main-header .logo-and-menu-container .menu-column, 
    header.main-header .logo-and-menu-container .mobile-menu-column,
    .main-header.menu-type-standard-menu .standard-menu-container{
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    

    Regarding the warnings, simply skip them as the warnings are notifications that let you know what is good and not good to implement but it is based in an old CSS technology.

    Thank you.

  • SofaandMore replied

    Hi, 

    it does not work the same :(

    http://sofaandmore.co.uk/sofaandmore/

  • [deleted] replied

    Hi SofaandMore

    I saw you screen shot at the bottom when you first posted the article, you have the logo between to menus, currently Kalium doesn't offer this future, it requires custom code currently in this package is not available hard code.

    If you're looking for professional help in this matter, there's always someone available for such tasks on the WP Kraken or Envato Studio. Pricing and timeline are always straightforward there and that's the main reason for recommending those services.