- This topic has 10 replies, 2 voices, and was last updated 8 years, 6 months ago by Andrew Misplon.
- AuthorPosts
- October 6, 2015 at 4:24 pm #2497
Me-shell AttardParticipantHi, is there a way to make the logo and tag line appear in line with each other as opposed to the tag line being under the logo? I’ve installed simple custom CSS and played around with some of the coding given on another topic, but I still can’t get it to work right.
Many Thanks!
October 6, 2015 at 4:30 pm #2498
Andrew MisplonKeymasterHi
Thanks for reaching out 🙂
Let’s try at Appearance > Custom CSS:
/* Logo and tagline inline */ .site-header .site-branding h1.site-title { display: inline-block; margin-rigth: 0.5rem; } .site-header .site-branding h2.site-description { display: inline-block; }
Tweak that as required and let me know how you come along.
October 6, 2015 at 4:38 pm #2499
Me-shell AttardParticipantUnfortunately nothing changed 🙁
I am new to all this as of like 2 days ago, so I’m not sure what I can tweak in it. I changed the ‘rigth’ to ‘right’ as it was coming up in red, and I changed the 0.5rem to 1.5 to see what would happen, but nothing moved.Thanks for your assistance 🙂
October 6, 2015 at 4:40 pm #2500
Andrew MisplonKeymasterOh dear! Sorry about the mistake. Yes, corrected, it should have been:
/* Logo and tagline inline */ .site-header .site-branding h1.site-title { display: inline-block; margin-right: 0.5rem; } .site-header .site-branding h2.site-description { display: inline-block; }
Please, use the Set as private reply checkbox below the comment form and send me your site link with the Custom CSS in place so I can take a look.
Thanks
October 6, 2015 at 4:49 pm #2501
Me-shell AttardParticipantThis reply has been marked as private.October 6, 2015 at 4:50 pm #2502
Andrew MisplonKeymasterAhh right, my CSS was for the site title and site tagline. Let me re-work that for the logo and tagline. One moment.
October 6, 2015 at 4:53 pm #2503
Me-shell AttardParticipantAh so sorry for my lack of knowledge! haha I’m clearly still learning all this.
October 6, 2015 at 4:53 pm #2504
Andrew MisplonKeymasterNot at all, I should have sent CSS for both. One moment…
October 6, 2015 at 5:10 pm #2505
Andrew MisplonKeymasterThanks for the wait.
If you head over to Appearance > Customize > Theme Design > Header and set the tagline font size to 19px the following should then work:
/* Logo and tagline inline */ .site-header .site-branding { display: flex; -webkit-align-items: center; align-items: center; } .site-header .site-branding-container { max-width: 40%; } .site-header .site-branding img { display: inline-block; margin-right: 5px; } .site-header .site-branding h2.site-description { display: inline-block; vertical-align: middle; }
Remove all the previous Custom CSS and use the above.
October 6, 2015 at 5:15 pm #2506
Me-shell AttardParticipantYou’re brilliant!! Thank you so much! Gold star for you!
October 6, 2015 at 5:16 pm #2507
Andrew MisplonKeymasterGlad that helped 🙂 If anything else comes up, let me know know.
- AuthorPosts
You must be logged in to reply to this topic.