Archived topic

how to put tagline to the right of site title?

7 replies · Started by Silvio on February 10, 2019

Viewing posts 1–8 of 8

February 10, 2019 at 7:40 am #806671

Hi,

I am trying to replicate this design, with tagline on the right of the title

http://retinart.net/graphic-design/secret-law-of-page-harmony/?utm_medium=newsletter&utm_campaign=reedsylearning&utm_source=bookdesign101

but I can't figure out which is the class to add / modify.

could you help with this?

to view: user silvio password v1v3r377

February 10, 2019 at 8:56 am #806727

Hi there,

Give this CSS a shot:

.site-branding > * {
    display: inline-block;
}

.site-logo {
    margin-right: 10px;
}

.main-title {
    padding-right: 15px;
    margin-right: 15px;
    border-right: 1px solid #ddd;
}

February 11, 2019 at 12:58 am #807096

Thanks, it worked.

Any change you can help align site title and navigation? Is there an option for that or does it depends on margin and padding?

February 11, 2019 at 8:47 am #807476

Try matching the height of your logo/title/tagline with the height of the navigation:

.site-branding, 
.site-logo {
    line-height: 60px;
}

February 11, 2019 at 11:55 am #807627

thanks Tom,

the support you provide is invaluable!

February 11, 2019 at 4:57 pm #807840

Glad I could help :)

February 21, 2019 at 11:34 am #816899

Tom - is there a way to have my logo on the left with my tagline to the right, with the tagline being two lines long? I can get the above code to work with one short tagline, but when I put in my full tagline, it does not work. I could use either the site-branding or site-description variables.

February 21, 2019 at 12:51 pm #816966

Hi there,

can you provide a link to your Site with the code in place? Might be easier to raise a new topic where you can share the link privately using the Site URL field.

This archived topic is closed to new replies.

Start building better websites today.