[Resolved] Get header logo, title and tagline in line with each other

Home Forums Support [Resolved] Get header logo, title and tagline in line with each other

Home Forums Support Get header logo, title and tagline in line with each other

  • This topic has 7 replies, 3 voices, and was last updated 5 years ago by David.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #834178
    Daniel

    Hi there,

    How can I get the site title, tagline and the logo all in line with each other horizontally?

    They are currently stacked up under each other, I’d like to have them in line as so (logo, title, tagline).

    I’ve had a look through the forum and found the following css:


    @media
    (min-width:769px) {
    .site-branding {
    display: inline-block;
    }

    .site-logo {
    float: left;
    margin-right: 20px;
    }
    }

    However, this doesn’t seem to work and the order remains the same.

    Many thanks.

    #834184
    Leo
    Staff
    Customer Support

    Hi there,

    That CSS should work.

    Any chance you can link me to the site with the CSS added>

    Let me know ๐Ÿ™‚

    #834608
    Daniel

    Hi Leo,

    This is the link to the site:

    http://artsground.com/

    I’ve added the CSS above in the Simple CSS part of site appearance customization.

    Many thanks

    #834714
    David
    Staff
    Customer Support

    Hi there,

    you have some errors in the CSS above that rule:

    1.

    .site-logo {
        max-width: 55px;
        max-height: 55px;
    }
    }

    Remove the last }

    2.

    .site-header {
        margin-bottom: 2px;

    Add a } after this rule.

    #834730
    Daniel

    Hi David,

    Thanks a lot for having a look at this. I made some changes to the CSS last night and must have missed those errors ๐Ÿ™‚

    After these changes the logo is fine, however the site tagline still seems to be under the title. Any way of getting this on the right of the title?

    Many thanks.

    #834732
    David
    Staff
    Customer Support

    Try this:

    .site-branding > p {
        display: inline;
    }
    #834741
    Daniel

    That works great David!

    Thank you very much for your help David & Leo.

    Have a great day!

    #834744
    David
    Staff
    Customer Support

    You’re welcome, glad we could be of help

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