2012-04-03 15 views
6

特定のIE8モードおよび他のIEブラウザでは、各メニューの下部に余分なスペースがあるようにメニュー項目を変更するASP.net垂直メニューに問題があります以下のようになります。IE8互換モードAsp.netメニューの埋め込みの問題

(左が悪く、右が良い)。これはIEだけです。

bad _____________________ good

私は余裕をした:-1pxの。下部と上部のために、以下を取得し、まだ以下のようにスペースを追加します。ここ

enter image description here

は私のCSSです:

.SideStaticMenuStyle a, 
.SideStaticMenuStyle a:visited, 
.SideStaticMenuStyle a:active 
{ 
    color: #000000;  
    text-decoration: none; 
    font-weight: normal; 
    font-family: verdana; 
    font-size: 12px; 
    white-space:normal; 
} 
.SideStaticMenuStyle a:hover 
{ 
    color: #ffffff;  
    text-decoration: none; 
    font-size: 12px;   
    font-weight: normal; 
    font-family: verdana; 
} 

.SideStaticMenuStyle td 
{ 
    background-color: #c2d0e9; 
    width: 160px; 
    line-height:14px; 
} 

.SideStaticSelectedStyle td, 
.SideStaticSelectedStyle a, 
.SideStaticSelectedStyle a:visited, 
.SideStaticSelectedStyle a:active, 
.SideStaticSelectedStyle a:hover 
{ 
color: #ffffff;  
text-decoration: none; 
font-weight: bold; 
font-family: verdana; 
font-size: 11px; 
white-space:normal; 
background-color: #6C85B0; 
} 

.SideStaticHoverStyle td 
{ 
    font-weight: normal; 
    font-family: verdana; 
    background-color: #6c85b0; 
    color: #ffffff; 
} 
.SideStaticHoverStyle td:hover a 
{ 
      color: #ffffff; 
     } 

.SideStaticMenuItemStyle 
{ 
    font-weight: normal; 
    font-family: verdana; 
    border-bottom: solid 1px #012754; 
    border-left: solid 1px #012754; 
    border-right: solid 1px #012754; 
    border-collapse:collapse; 
} 
.SideStaticMenuItemStyle td 
{  
    padding: 2px 2px 2px 3px; 
    text-align: left; 
    font-weight: normal; 
    font-family: verdana; 
    } 
.SideStaticHoverStyle 
{ 
    font-weight: normal; 
    font-family: verdana; 
} 

ここに私のHTMLれる:

<asp:Menu ID="Menu2" runat="server" Orientation="Vertical" ItemWrap="true"> 
      <DataBindings> 
       <asp:MenuItemBinding DataMember="MenuItem" TextField="Title" NavigateUrlField="URL" /> 
      </DataBindings> 
      <StaticMenuStyle CssClass="SideStaticMenuStyle" /> 
      <StaticSelectedStyle CssClass="SideStaticSelectedStyle" ItemSpacing="0px" /> 
      <StaticMenuItemStyle CssClass="SideStaticMenuItemStyle" ItemSpacing="0px" /> 
      <DynamicHoverStyle CssClass="SideDynamicHoverStyle" /> 
      <DynamicMenuStyle CssClass="SideDynamicMenuStyle" /> 
      <DynamicSelectedStyle CssClass="SideDynamicSelectedStyle" /> 
      <DynamicMenuItemStyle CssClass="SideDynamicMenuItemStyle" /> 
      <StaticHoverStyle CssClass="SideStaticHoverStyle" /> 
     </asp:Menu> 

ページは、コード生成:

<table id="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2" class="SideStaticMenuStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_5 ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_2" cellpadding="0" cellspacing="0" border="0"> 
    <tr onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2n1"> 
     <td><table class="SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_4" cellpadding="0" cellspacing="0" border="0" width="100%"> 
      <tr> 
       <td style="width:100%;"><a class="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_1 SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_3" href="servicelink.aspx" target="_self" style="border-style:none;font-size:1em;">ServiceLink</a></td> 
      </tr> 
     </table></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr><tr onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2n2"> 
     <td><table class="SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_4" cellpadding="0" cellspacing="0" border="0" width="100%"> 
      <tr> 
       <td style="width:100%;"><a class="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_1 SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_3" href="fnpc.aspx" target="_self" style="border-style:none;font-size:1em;">Fidelity National Property and Casualty</a></td> 
      </tr> 
     </table></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr><tr onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2n3"> 
     <td><table class="SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_4" cellpadding="0" cellspacing="0" border="0" width="100%"> 
      <tr> 
       <td style="width:100%;"><a class="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_1 SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_3" href="ceridiancorp.aspx" target="_self" style="border-style:none;font-size:1em;">Ceridian Corporation</a></td> 
      </tr> 
     </table></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr><tr onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2n4"> 
     <td><table class="SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_4" cellpadding="0" cellspacing="0" border="0" width="100%"> 
      <tr> 
       <td style="width:100%;"><a class="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_1 SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_3" href="remy.aspx" target="_self" style="border-style:none;font-size:1em;">Remy International, Inc.</a></td> 
      </tr> 
     </table></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr><tr onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2n5"> 
     <td><table class="SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_4" cellpadding="0" cellspacing="0" border="0" width="100%"> 
      <tr> 
       <td style="width:100%;"><a class="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_1 SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_3" href="abrh.aspx" target="_self" style="border-style:none;font-size:1em;">American Blue Ribbon Holdings, LLC</a></td> 
      </tr> 
     </table></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr><tr onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2n6"> 
     <td><table class="SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_4" cellpadding="0" cellspacing="0" border="0" width="100%"> 
      <tr> 
       <td style="width:100%;"><a class="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_1 SideStaticMenuItemStyle ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_3" href="cascade.aspx" target="_self" style="border-style:none;font-size:1em;">Cascade Timberlands</a></td> 
      </tr> 
     </table></td> 
    </tr><tr style="height:0px;"> 
     <td></td> 
    </tr> 
</table><a id="ctl00_ContentPlaceHolder1_ctl00_ctl06_ctl00_Menu2_SkipLink"></a> 
    </td> 
+0

は、メニューのためのいくつかのサンプルHTMLを投稿することができますしてください?また、線の高さを減らしたり、取り除いてみてください。 – dash

+0

私はdidntの助けをしている行の高さを取り除こうとしました。私のHTMLコードを追加しました。 –

+0

生成されたHTMLを(ブラウザ内のように)投稿できますか?ASP開発者ではなく、投稿したXMLは意味がありません:) – Pete

答えて

2

問題は、あなたの<asp:Menu />のマークアップにあります。 <StaticMenuItemStyle />ItemSpacing="0"は、これらの特別な<tr />タグを作成するものです。それを削除し、彼らは消えてしまいます。

<asp:Menu ID="Menu2" runat="server" Orientation="Vertical" ItemWrap="true"> 
    <DataBindings> 
     <asp:MenuItemBinding DataMember="MenuItem" TextField="Title" NavigateUrlField="URL" /> 
    </DataBindings> 
    <StaticMenuStyle CssClass="SideStaticMenuStyle" /> 
    <StaticSelectedStyle CssClass="SideStaticSelectedStyle" /> 
    <StaticMenuItemStyle CssClass="SideStaticMenuItemStyle" /> 
    <DynamicHoverStyle CssClass="SideDynamicHoverStyle" /> 
    <DynamicMenuStyle CssClass="SideDynamicMenuStyle" /> 
    <DynamicSelectedStyle CssClass="SideDynamicSelectedStyle" /> 
    <DynamicMenuItemStyle CssClass="SideDynamicMenuItemStyle" /> 
    <StaticHoverStyle CssClass="SideStaticHoverStyle" /> 
</asp:Menu> 

ここで私はそれが固定表示され、私のローカルマシンのスクリーンショットです:

enter image description here

+0

BAM!これはそれを修正しました。あまりにも単純な見落とされた何かうわー。ありがとうScott、私はあなたに賞金を授与します(残って7時間)。ありがとう –

+0

まったく問題ありません。面白いのは、私もそれを見落としたということです。私はCSSを使ってプレイしようとしていましたが、あなたが投稿したHTMLを生成しました。それで、私はそれが ''タグを生成するメニュー自体の設定でなければならないと言いました。そうでなければそこにいることは意味をなさないでしょう。だから私は ''をあなた自身が投稿したもので作りました。そして、私がやった最初のことは 'ItemSpacing =" 0 "'を取り除いて、あなたが言ったように、BAM!彼らはなくなった。 –

+0

sweet。再度、感謝します! –

2

をいくつかの余分なTRがありますし、 TD実際にテキストを含むタグの間のタグ。それらを削除すると、あなたはOKであるはずです

+0

hmm、それはasp.netメニューから生成され、コード自体ではないように見えますが、何とか手作業でそれらを何らかの形で取り除くことができるかどうかを確認する必要があります –

+0

私はこれらのタグを取り除く方法を見つけられませんでしたidを持っていない。 –

+0

tr [style] { ディスプレイ:なし!重要; } IDを持たないすべてのタグにはスタイル属性があるため、そのタグを使用して表示されないようにすることができます。しかしセレクタはIE7ではサポートされていません。 IE8以上の問題を処理する可能性が最も高いです。 – Ray

関連する問題