How To Center This Logo On A Shopify Theme?

- 1 answer

Working on this site at the moment ( - I wanted to put the logo in the middle with the navigation on the left, and potentially the search bar on the right if possible?

I wanted the navigation to be similar to this:

Any help would be appreciated

I've tried using the Shopify theme liquid but its organised a little differently than vanilla CSS, which is what I'm used to!



You can do it with display: flex; Try this:

@media screen and (min-width: 769px){
    .site-header .grid, .site-header .grid--rev, .site-header .grid--full {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: center;
    .site-header .grid>.grid__item, .site-header .grid--rev>.grid__item, .site-header .grid--full>.grid__item {
        /* float: none; */
        /* display: table-cell; */
        /* vertical-align: middle; */
        width: 60%;
} { order: 2; } {
    width: 40%;
    display: flex;
    order: 1;

This is the result: enter image description here