0

私は質問への答えを高低で検索しましたが、何も機能していないようですので、ここの誰かが私を助けてくれることを願っています.

SharePoint サイトのトップ ナビゲーション メニューを中央に配置しようとしていますが、うまくいきません。NavMainBar クラスの下で、幅、margin:0 auto および text-align=center を他のさまざまな提案とともに指定しようとしました。何をしようとしても、サブ サイト (テキスト) は常に左揃えになります。マイナーなものだと確信していますが、私の人生では何かが欠けています。

CSSのスニペットが添付されています。誰かが私が間違っている場所を教えてくれることを望んでいました。

編集:私が問題を抱えていることを少し明確にするために、スクリーンダンプを追加しました。メニューのサブサイト (フォーム、Infopath、テスト 1 など) 内のテキストをページの中央に移動する必要があります。基本的に、ドロップダウンの項目ではなく、トップナビゲーション メニューの見出しテキストのみを中央に配置します。

http://i.imgur.com/mYcgR9g.png

乾杯

/* Top Menu */
.NavMainBar {position:relative; width:100%; text-align:center; height:40px; padding-bottom:1px; border:0px solid #000;}
.NavBarIn {float:left; padding-left:10px; height:40px; }
.NavBarLeft {float:left; height:40px; width:9px; background-color:#EBEBEB; /*background-image:url('../../../Images/navBarLeft.png');*/ background-repeat:no-repeat;}
.NavBarRight {float:left; height:40px; width:9px; background-color:#EBEBEB; /*background-image:url('../../../Images/navBarRight.png'); */ background-repeat:no-repeat;}
.NavBarFill {float:left; width:98%; height:40px; background-color:#EBEBEB; /*background-image:url('../../../Images/navBarFill.png'); */ background-repeat:repeat-x;}

編集: HTML を追加 - 他のクラスへの参照は、ストック標準の core4v.css に対するものです。

<div id="zz16_TopNavigationMenuV4" class="s4-tn">
<div class="menu horizontal menu-horizontal">
    <ul class="root static">
        <li class="static"><a class="static menu-item" href="/forms/SitePages/Home.aspx" accesskey="1"><span class="additional-background"><span class="menu-item-text">Forms</span></span></a></li><li class="static dynamic-children"><a class="static dynamic-children menu-item" href="/infopath/Pages/default.aspx"><span class="additional-background"><span class="menu-item-text">Infopath</span></span></a><ul class="dynamic">
            <li class="dynamic dynamic-children"><a class="dynamic dynamic-children menu-item" href="/infopath/_layouts/viewlsts.aspx?BaseType=0"><span class="additional-background"><span class="menu-item-text">Lists</span></span></a><ul class="dynamic">
                <li class="dynamic"><a class="dynamic menu-item" href="/infopath/Lists/TimeInLieu/AllItems.aspx"><span class="additional-background"><span class="menu-item-text">TimeInLieuMaster</span></span></a></li><li class="dynamic"><a class="dynamic menu-item" href="/infopath/Lists/TimeInLieuDaysOff/AllItems.aspx"><span class="additional-background"><span class="menu-item-text">TimeInLieuDaysOff</span></span></a></li>
            </ul></li><li class="dynamic dynamic-children"><a class="dynamic dynamic-children menu-item" href="/infopath/_layouts/viewlsts.aspx?BaseType=1"><span class="additional-background"><span class="menu-item-text">Libraries</span></span></a><ul class="dynamic">
                <li class="dynamic"><a class="dynamic menu-item" href="/infopath/TravelRequest/Forms/AllItems.aspx"><span class="additional-background"><span class="menu-item-text">TravelRequest</span></span></a></li><li class="dynamic"><a class="dynamic menu-item" href="/infopath/ISAuthorisation/Forms/AllItems.aspx"><span class="additional-background"><span class="menu-item-text">ISAuthorisation</span></span></a></li>
            </ul></li>
        </ul></li><li class="static"><a class="static menu-item" href="/TEST1/Pages/default.aspx"><span class="additional-background"><span class="menu-item-text">Test 1</span></span></a></li><li class="static"><a class="static menu-item" href="/test2/Pages/default.aspx"><span class="additional-background"><span class="menu-item-text">Test 2</span></span></a></li><li class="static"><a class="static menu-item" href="/test3/Pages/default.aspx"><span class="additional-background"><span class="menu-item-text">Test 3</span></span></a></li><li class="static"><a class="static menu-item" href="/test4/Pages/default.aspx"><span class="additional-background"><span class="menu-item-text">Test 4</span></span></a></li>
    </ul>
</div>

4

2 に答える 2

0

s4-tn は「幅: 100%」で、メニューの水平方向が「表示: インライン」で「マージン: 0 自動」である必要はありませんか? これにより、子 div が親 div の中央に配置されます。

于 2013-06-14T04:39:39.460 に答える
0

すべてのボタンを独自の内部に配置<div>

マスターdiv(ボタンのあるものではない)で、設定しますalign="center"

次に、削除しますfloat:left

于 2013-06-08T21:26:39.407 に答える