[Support request] How do I keep the logo on the left?

Home Forums Support [Support request] How do I keep the logo on the left?

Home Forums Support How do I keep the logo on the left?

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #632523
    Tammi

    Dear Tom and GP support team,

    Per advice already given to a support request, I used the following CSS to move the logo to the left of the site information.

    /* putting the site logo to the left of the title */
    .site-branding {
          padding: 15px 0px 0px 10px;
    }
    
    .site-logo {
          float: left !important;
    }

    However, while that works for the desktop and the tablet views, it does not work in the smartphone view. The logo floats left but *after* the site branding.

    As a temporary fix, I added to simply remove the logo in smartphone view.

    @media (max-width: 500px) {
          .site-logo {
                display: none;
          }
    }

    However, I would really welcome an alternative that shows the logo in the right (left!) position on smartphones.

    Your suggestions would be welcome!

    GP Premium 1.6.2
    #632662
    Leo
    Staff
    Customer Support

    Hi there,

    The problem is that there is simply not enough space to fit the logo + title + description.

    I suppose you can try some CSS to make them all smaller:

    @media (max-width: 768px) {
        .site-logo {
            max-width: 50px;
        }
        .main-title, .site-description {
            font-size: 10px;
        }
    }

    Might have to adjust the numbers to make them it even smaller.

    My honest suggestion would be to ditch the title and description on mobile and just use our mobile header feature. Your logo is perfect for the mobile header logo:
    https://docs.generatepress.com/article/mobile-header/

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