Question

这是我网站的链接：http://www.ishturd.com

正如您在此处所看到的，徽标位于网站标题和标语的顶部，我需要它并排显示，即徽标和网站标题，标语将低于标题，因为它现在是。任何帮助将不胜感激，因为我不知道任何编码。

这是我的style.css中网站标题的完整CSS（抱歉，我不知道该发布什么）

    .site-title {
    margin: 0;
    color: #171717;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 34px;
    font-size: 3.4rem;
    font-weight: bold;
   }

    .site-title a {
    color: #171717;
    font-weight: bold;
    text-decoration: none;
    }

    .site-title a:hover,
    .site-title a:focus {
    text-decoration: none;
    }

    .no-site-tagline .site-title {
    margin-bottom: 22px;
    margin-bottom: 2.2rem;
    }

    @media screen and (min-width: 800px) {
    .site-branding {
    float: left;
    max-width: 50%;
    }

    .branding-right .site-branding {
    float: right;
    }
    }

    .site-description {
    display: block;
    margin: 11px 0 22px;
    margin: 1.1rem 0 2.2rem;
    font-size: 12px;
    font-size: 1.2rem;
    letter-spacing: 1px;
    letter-spacing: 0.1rem;
    text-transform: uppercase;
    } 

    .site-description a {
    text-decoration: none;
    }

    .site-description a:hover,
    .site-description a:focus {
    text-decoration: none;
    }

提前致谢！

Answer 1

我清理了网站品牌html和css：

HTML：

<div class="site-branding">
  <a href="http://www.ishturd.com/" class="custom-logo-link" rel="home" itemprop="url">
  <img width="151" height="105" src="http://www.ishturd.com/wp-content/uploads/2016/08/cropped-Ishturd-2.png" class="custom-logo" alt="cropped-Ishturd-2.png" itemprop="logo" sizes="(max-width: 151px) 100vw, 151px">
     <h1 class="site-title">
       ishturd 
       <br>
       <span class="site-description">The Honest Part of The Internet</span>
    </h1>
  </a>
</div>

CSS：

.site-branding {
  width: 600px;
}
.site-branding a { text-decoration: none;}
.site-branding a img { float: left;}
.site-branding a h1 { float: left; width: 350px; padding: 0px; margin:0px;}
.site-branding a span { font-size: 14px;}

如果需要，可以进一步改进此代码，请查看小提琴：

https://jsfiddle.net/Lvdt0ttd/

如何移动徽标旁边的网站标题和标语？

1 个答案: