知りたい事
スマートフォンで閲覧する際、設定したヘッダー画像に「設定」「ログイン・ログアウト」「ユーザー名」ボタンが重なってしまうため、重ならない方法を知りたい。
<スマートフォンで閲覧した際の見え方>
CSS設定前 CSS設定後
回答
「詳細カスタマイズ設定>スタイル設定(CSS)>スタイル設定:CSS設定」の領域にCSSを追加する事で重ならないようにする事ができます。
追加するCSS
header .header-block .right-top {
position: initial !important;
padding: 1.2rem;
}
header div.edit li {
float: right;
}
header .header-block .right-bottom {
position: absolute;
right: 11rem;
left: 1.2rem;
bottom: 1.2rem;
}
/* 設定ボタンがある場合の設定 */
header .header-block:has(.headerAdmin) .right-bottom {
right: 17rem;
}
header h1 img {
max-width: 100%;
max-height: 70px;
height: auto;
}