Question

因此，在对我的客户站点进行一些更改时，我遇到了一个H1标签未对齐的问题（请参见屏幕截图）。这仅发生在IE＆Edge中，这是试图解决该问题的CSS代码。

.banner-title {
    margin-top: -10px;
    font-size: 26px;
    color:#50585c;
    text-align: left;
    -ms-text-align-last: left;
}

.banner-title h1 {
    text-align: left;
}

这也在最新安装的WordPress上运行。上面的代码（实际上）是完全没有用的。

（屏幕截图）：https://prnt.sc/jzyk7i

如果您想帮助解决此问题，请先感谢您！

编辑＃1：更新了网站标语部分的完整代码。

CSS：

#banner{
    height:70px;
    margin-bottom:30px;
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffffff 0%, #deeff7 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#deeff7)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #ffffff 0%,#deeff7 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #ffffff 0%,#deeff7 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #ffffff 0%,#deeff7 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #ffffff 0%,#deeff7 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#deeff7',GradientType=0 ); /* IE6-9 */
}

#banner_container{
    height:100%;
}

.banner-title {
    margin-top: -10px;
    font-size: 26px;
    color:#50585c;
    text-align: left;
    -ms-text-align-last: left;
}

.banner-title h1 {
    text-align: left;
}

.banner-subtitle{
    font-size:18px;
    color:#798c95;
}

HTML：

<header id="banner">
    <div id="banner_container" class="container">
        <h1 class="banner-title"><?php echo the_title(); ?></h1>
        <p class="banner-subtitle"><?php echo apply_filters( 'banner_sub_title', get_bloginfo( 'description' ) );?></p>
    </div>
</header>

文字在WordPress的Edge / IE中未向左对齐

0 个答案: