Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #29125
    dazzastark
    Guest

    Hello,

    Using the BoldGrid theme Cobalt for Consulting (not marketing) and need to Center the logo and “burger” menu for small mobile devices. I tried changing the CSS but no avail. Could someone help?

    #29126
    BoldGrid Contributor
    Guest

    You add the following to achieve this:

    @media (max-widht: 768px) {

    .site-title img,

    button.navbar-toggle{

    display: flex !important;

    flex-direction: column !important;

    margin: auto !important;

    }

    }

    #29127
    dazzastark
    Guest

    Thanks, this worked for the logo but not the menu.

    Any suggestion for the “burger” menu button (collapsed and open)?

    #29128
    BoldGrid Contributor
    Guest

    Sorry for the inconvenience. Would you be comfortable providing the domain having this issue? There may be interferring code from another plugin or custom setting.

    #29129
    dazzastark
    Guest

    norbar.ca

    #29130
    BoldGrid Contributor
    Guest

    Thanks for the URL and I apologize for the long wait. Unfortunately, I’m unable to see past the under construction page. Do you have an URL which shows the issue?

    #29131
    dazzastark
    Guest

    Sorry for the delay. Please try the URL: norbar.ca again on a smaller responsive device to see the issue.

    #29132
    carlosd
    Guest

    Using the Google Dev Tools I found the elements:

    .palette-primary .navbar-default .navbar-toggle, .palette-primary

    and constructed the following CSS code to make it more responsive:

    @media (max-width: 768px) {
    .palette-primary .navbar-default .navbar-toggle, .palette-primary {
    display: flex !important;
    flex-direction: column !important;
    margin: auto !important;
    }
    }

    You can use that to try and modify the CSS, however, making customizations to the theme through the CSS is not ideal and may be overwritten during updates to your theme. If that occurs you can simply reapply the CSS through the Editor. 

    I hope this helps!

    Sincerely,

    Carlos D

    #29133
    dazzastark
    Guest

    Tried this and something is not taking.

    I am using boldgrid and the custom css section in the customizer.

    #29134
    christopherm
    Guest

    I’d recommend targeting the element using your browser’s developer tools. That way you can try CSS code live.

Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘How can I centre my logo and “burger” menu for small mobile devices?’ is closed to new replies.