Logo and site title/site description in the same line

Hi alina1983m ,

Replace below css into your style.css file located at site-name/wp-content/themes/motif/ folder.


.display-header-text .site-image {
margin-bottom: 12px;
display: inline-block;
}
.site-title {
font-size: 34px;
font-size: 2.6153rem;
font-weight: bold;
line-height: 1;
margin-bottom: 0;
margin-left: 5px;
display: inline-block;
}
.site-description {
color: #333;
line-height: 1;
margin: 10px 0 0 15px;
display: inline-block;
}


Hope this will helps you.

Thanks for helping out with that custom CSS.

Replace below css into your style.css file

Alina – please don’t edit the theme files directly, otherwise your changes will be overwritten every time the theme is updated.

An easy way to add custom CSS is to install the Jetpack plugin and activate the Custom CSS module. You’ll then add your custom CSS in the new stylesheet editor that’ll appear in your dashboard, under Appearance > Edit CSS. You could also install a standalone custom CSS plugin if you prefer.

If you need further help, please provide a link to your site if it’s public, as it’s always easier to help you if we can see your site directly. Thanks!

Hi,

thanks for your reply, unfortunately the “site title” just pushes “site description” to the right (if there is no “site-title”, description is positioned on the left). Logo stays abowe the text.

Alina

You could give something like this a try. I’ve added a media query so the smallest view is unaffected.

@media screen and (max-width: 362px) {
  .site-logo-link {
       display: inline-block;
       margin-bottom: -30px;
  }
  .site-title {
       display: inline-block;
  }
  .site-description {
       margin-left: 105px;
  }
}

You can adjust the margin values as you like.