[ひげガール]

【お使いの Snow Monkey のバージョン】25.2.4
【お使いの Snow Monkey Blocks のバージョン】20.3.5
【お使いの Snow Monkey Editor のバージョン】 9.3.2
【お使いのブラウザ】Chrome
【当該サイトのURL】https://gaikokujin-koyo.org/

### 実現したいこと

当該サイトのように、
グルーバルナビゲーションの左側のロゴを１行
グローバルナビゲーションの右側を２行（ヘッダーコンテンツ１行、メニュー１行）
をしたい

### 発生している問題

CSSを追記して実装しようとしたのですが、
当該サイトの
#menu-main-menu-1 {
width: 80%;
margin: 0 0 0 auto;
}
から先に進めなくなってしまいました。

### 試したこと

とりあえず、下記の３通りで代変えしています。

１）ヘッダーサブメニューで表記

この時、ヘッダーサブメニューをある程度目立つように大きくすると、
ロゴの上に余白ができてしまいます。

２）カスタマイズからヘッダーを２行にする
この場合、ロゴも１行、メニューも１行になってしまいます。

３）カスタマイズからヘッダーを１行にする

この場合、メニューが長くなってきた時、改行だらけになってしまいます。

 

 

ちなみに、実装したいサイトについては、結局、専用テーマを書きましたので、
喫緊の問題はないのですが、
最近の色々なことを鑑みると、
「スノーモンキーで参考サイトを実現できる方法」
を教えてご相談できればなあと思っています。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

あーこのサイト Snow Monkey なんですね…！

要は、2行レイアウトにして、2行目をネガティブマージンでぐいっと上に持ち上げてるみたいです。

@media (min-width: 1024px) {
  .l-2row-header .l-2row-header__row:last-child {
    margin-top: -50px !important;
  }

  .l-2row-header .p-global-nav {
    margin-left: auto;
    width: 80%;
  }
}

♥ 0

いいねをした人: 居ません

[投稿者]

投稿