php - WordPress标题中的神秘框

Question

我遇到了一个无法解决的奇怪问题。我在我的 WordPress 标题中添加了一个 Logo ，通过添加代码以启用定制程序中的选项，这导致“a href = ...”div 在我无法获取的 Logo 下显示为“不可见”的空框摆脱。

我试过以一百种不同的方式编辑 CSS，但无法让它消失...

我做了很多定制，但我的起点是 Underscores 入门主题。

您可以在此处查看该网站。您需要使用元素检查器来查看空框:

www.salientcity.com

谢谢!

这是我头文件中的php

<div class="title-box">
<?php $logo=get_theme_mod('logo');?>
    <?php if ($logo) { ?>
        <a href="<?php echo home_url(); ?>"><img src="<?php echo $logo; ?>" alt="<?php bloginfo( 'name' ); ?>"/></a>
    <?php } else { ?>
        <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
        <h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
    <?php } ?>

这是我正在使用的 CSS:

.header-image img {
    display: block;
    margin: 0 auto;
}
.header-background-image {
    background: no-repeat center;
    background-size: cover!important;
    -moz-background-size: cover!important;
    -webkit-background-size: cover!important;
}

.header-background-image .title-box { /* Main image box in header, where logo will be */
    background: #ff9900;
    background: hsla(36, 100%, 50%);
} 
.site-branding {
    padding: 2rem 0; /* Header block padding top and bottom */
    text-align: center;
    background: #fff; /* Header block color, background of website image */
    background: hsl(0° 0% 100%)
}
.title-box {
    width: 600px;
    max-width: 75%;
    padding: 5rem 0 0 0;
    margin: 0 auto;
}

.site-title {
    font-weight: 300;
    font-size: 40px;
    font-size: 4.5rem;
    text-transform: uppercase;
    line-height: normal;
    padding-bottom: 1rem;
}

.site-description {
    font-weight: 100;
    font-size: 20px;
    font-size: 2rem;
}

.site-title a,
.site-description { /* Font color of header, eventuely changed for logo */
    color: #fff;
    color: hsl(0, 0%, 100%);

Answer 1

我还注意到了一些事情。请做一件事，只需在 photoshop 中编辑您的 Logo 并删除 Logo 顶部和底部的多余空间，然后上传您的新 Logo 。我希望你不会看到这个 anchor 框。

看这里是您的 Logo ，顶部和底部都有空间。 http://salientcity.com/wp/wp-content/uploads/2015/04/Salient-logo.png