[ 解決済 ] グローバルメニューのボタンデザインについて

[yoko8525]

■ 利用テーマとバージョン :Lightning pro バージョン: 8.3.1

■ 質問内容：
ヘッダーのロゴとグローバルメニューをそれぞれCSSをいじって中央寄せにしています。
グローバルメニューは画面をスクロールさせると最上部にボタンが固定表示されますが、非スクロール時も同じようなデザインでメニューボタンを設置したいのですが、可能でしょうか。

[DRILL LANCER]

ヘッダーのロゴとグローバルメニューをそれぞれCSSをいじって中央寄せにしています。

どのように実現しているのかわかりませんので上記も含めたコードを書きます。

@media (min-width: 992px) {

	.container.siteHeadContainer {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		padding-bottom: 0px;
	}

	.navbar-header {
		width: 100%;
		order: 0;
		float: none;
	}

	.siteHeader_logo {
		float: none;
		width: 100%;
		text-align: center;
	}

	.siteHeader_logo img {
		margin: 0 auto;
	}

	.gMenu_outer {
		width: 100%;
		order: 1;
		float: none;
		min-height: unset;
		clear: both;
	}

	ul.gMenu {
		float: none;
		display: flex;
		justify-content: center;
		float: none;
		display: flex;
	}
		
	.gMenu_outer nav {
		width: 960px;
		max-width: 960px;
		margin-left: auto;
		margin-right: auto;
		display: block;
	}
	.gMenu>li {
		width: 50%;
		border-left: 1px solid #f5f5f5;
	}
	.gMenu>li:last-child {
		border-right: 1px solid #f5f5f5;
	}
}

@media (min-width: 1200px) {
	.gMenu_outer nav {
		width: 1140px;
		max-width: 1140px;
	}
}

[yoko8525]

DRILL LANCER様、ありがとうございます。

中央寄せについてはご教示いただいたコードと同じ内容でした。
教えていただいたコードを試しましたところ、希望とおりのボタンデザインになりました！

ありがとうございました。

[投稿者]

投稿