Lightning ヘッダーを中央寄せ | コピペでWordPressカスタマイズ（備忘録）

Lightningのヘッダータイトル（ロゴ）やメニューを中央寄せする

ヘッダーロゴとメニューを中央寄せ

※2025年確認

.site-header--layout--nav-float .site-header-container {
display: block;
}
.site-header--layout--nav-float .site-header-logo a {
margin: 0 auto;
}
.global-nav--layout--float-right .global-nav-list {
margin-left: auto;
margin-right: auto;
}

参考

さらにメニューに背景色を入れて、幅を広げる

	.global-nav--layout--float-right {
		background:#c81e1e;
	}
	.global-nav-name {
		color:#fff;
	}
	.global-nav-list li {
		width:150px;
	}

ヘッダーロゴとメニューを中央寄せ（2021年）

.site-header--layout--nav-float .site-header-container {
	display: flex;
  flex-direction: row;
  flex-wrap: wrap;
	justify-content: center;
}

.site-header--layout--nav-float .site-header-logo img {
	margin:0 auto;
}