CSS to align logo left

  • Hello,
    I originally posted this question in the theme support, but because it is quite an old theme (Lifestyle) I didn’t have much success – so figured I would try again here one last time. Is there a bit of code I can place in the additional CSS that will shift my logo to the left a bit so that it is aligned with the text on the landing page? I am going to start learning some basic CSS via the WordPress tutorial pretty soon, but if anyone could help me with this in the meantime it would be much appreciated.

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)
  • Moderator t-p

    (@t-p)

    Look for this css rule:

    .custom-logo-link {
    display: inline-block;
}

    Change it to:

    .custom-logo-link {
    display: inline-block;
    float: left;
}

    Don’t edit the theme files directly, otherwise your changes will be overwritten whenever the theme is updated.

    A custom CSS editor (usually titled Additional CSS) is included in the Customizer as of WordPress 4.7 specifically for this purpose.

    As an alternative, especially if you intend to modify more than just CSS, create a child theme.

    Thread Starter kian1977

    (@kian1977)

    Thanks t-p,
    I’ll try that later. Quick question: Do I find the CSS rule that you mentioned by navigating to the dashboard/appearance/editor in WordPress and then change the code to what you have suggested?

    Moderator t-p

    (@t-p)

    It should be in your currently active theme’s style.css file.

    Thread Starter kian1977

    (@kian1977)

    Thanks t-p,
    that worked quite well by simply adding the code to my additional CSS box in the appearance menu. Do you by chance know a piece of CSS that would close the space a bit between my title on the landing page (Need a writer?) and the short piece of body copy below? That space is kind of annoying. No problem if you’re not sure. I am going to learn some basic CSS in the near future, which means I hopefully won’t have to post on here quite so frequently.

    Moderator t-p

    (@t-p)

    that worked quite well

    Glad to know it ??

    CSS that would close the space a bit between my title on the landing page (Need a writer?) and the short piece of body copy below?

    The following css rule seems to control it.

    address, blockquote, p {
    margin: 0 0 1.5em;
}

    Change it to:

    address, blockquote, p {
    margin: 0 0 0;
}

    check for any side effect somewhere else.

    Thread Starter kian1977

    (@kian1977)

    Thanks t-p,
    I made the change as you suggested but now it is all too bunched up – as you can see.
    Is there a happy medium between the two? I tried playing around with the margin configurations a bit, but no luck so far. Thanks again for your time.

    Great info. Thanks ??

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘CSS to align logo left’ is closed to new replies.