0

ホームページに JQuery タブ コントロールを追加しましたが、灰色の領域が非常に大きくなり、原因を特定できない理由がわかりません。タブは機能していますが、醜いギャップがあります。

ここに画像の説明を入力

ここに私のコードがあります、

<asp:Content id="Content1" runat="server" contentplaceholderid="PlaceHolderMain">
<WebPartPages:SPProxyWebPartManager runat="server" id="spproxywebpartmanager"></WebPartPages:SPProxyWebPartManager>
<div id="ChartTabs">
    <ul>
        <li><a href="#tabs-Gantt">Gantt Chart</a></li> <li><a href="#tabs-Map">Map Chart</a></li>

    </ul>

    <div id="tabs-Gantt">

        <Web Part Zone 1>

     </div>

    <div id="tabs-Map">

         <Web Part Zone 2>      
    </div>

</div>




<asp:Content id="Content2" runat="server" contentplaceholderid="PlaceHolderAdditionalPageHead">
<style type="text/css">
ul li{
  display: inline;
}

</style>
    <link rel="stylesheet"  href="/sites/xxx/SiteAssets/jquery-ui.css" />
    <script type="text/javascript" src="/sites/xxx/SiteAssets/jquery.min.js"></script>
    <script type="text/javascript" src="/sites/xxx/SiteAssets/jquery-ui.min.js"></script>

    <script type="text/javascript">
    $(function() {
        $( "#ChartTabs" ).tabs();
    });
    </script>

</asp:Content>
4

1 に答える 1

0

この問題を解決するには、リストに高さを設定します。

<ul style="height: 35px; list-style-type: none;"> ... </ul>
于 2015-02-23T03:58:09.910 に答える