シリウスに組み込み設定したCSS形成のナビゲーションは、パソコン
画面では正常に作動しているか？

と思いますが、スマートフォンの閲覧画面でも同作動が確認されるのですね

画面の小さなスマートフォンで、ナビゲーションが現れてしまうと
さらに小さな画面の視野範囲がさらに縮小し見ずらいこと？
必須

スマートフォンのサイズでは、ナビゲーションレイアウトも縮小はするのですが
やはり、見ずらいは変わらず....

対処法として、スマートフォンからの閲覧ではナビを非表示とする
指定をします

当サイトでご案内の他のナビでも非表示指定は同様ですが、
CSS形成ナビの場合は、多少形式が変わります

HTMｌ記載のナビ要素ですね

id要素　class要素を確認ください

<div id="normalnav" class="drop">
<li><a href="#">シリウスカスタマイズ</a>
<ul>
<li><a href="#">submenu</a></li>
<li><a href="#">submenu</a></li>
<li><a href="#">submenu</a></li>
<li><a href="#">submenu</a></li>
</ul>
</li>

スタイルシートでは、

id要素　normalnav

class要素　drop

を、スマートフォンで反映されるサイズ指定　@media内に

CSS指定で作動の変更を指示します

@media(max-width:698px){
#container{
width: 100%;
}

以下を追記します

.dropc{
*zoom: 1;
list-style-type: none;
width: 100%;
margin: 0px auto 30px;
padding: 0;
}

#normalnav {
width: 100%;
z-index: 10000;
display: none;
}

display: none;が、スマ―トフォンサイズでは
ナビを出現させないと指示しているのです

スポンサーリンク

ページトップ
CSS形成ナビ　スマートフォン閲覧障害対処法
グローバルナビをCSS形成で組み込むカスタマイズまとめ
シリウスカスタマイズTOP