Question

我尝试将网站徽标与CSS居中对齐，但是没有任何变化。使用Kalium主题时，是否可以将网站徽标放在标题的中心位置？

Answer 1

我认为这取决于您使用的标题。但是据我所知，它们都是以flex布局构建的。

因此，请举例说明主要布局：https://demo.kaliumtheme.com/main/

在这种情况下，您实际上可以将flex-direction设置为column，将justify-content设置为center：

header.main-header .logo-and-menu-container {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

此外，我还会给徽标加上一些margin-bottom：

.header-logo.logo-image {
    margin-bottom: 30px;
}

瞧，看起来不错。

Answer 2

尝试以下代码：

header.main-header .logo-and-menu-container
 {
    display:block;
    margin-left:auto;
    margin-right:auto
}

如何在Wordpress的Kalium主题上将徽标居中？

2 个答案: