Contrôle de menu ASP.NET provoquant un problème de hauteur de cellule de tableau

StackOverflow https://stackoverflow.com/questions/1607944

  •  05-07-2019
  •  | 
  •  

Question

J'utilise un tableau à deux cellules pour ma présentation de navigation (que je devrais probablement utiliser css). La cellule de gauche est un hyperlien. La cellule de droite contient un contrôle de menu ASP.NET.

Lorsque la page est rendue dans IE7, le lien hypertexte et le menu se trouvent sur la même ligne.

Lorsque vous utilisez FF2, FF3 ou IE8, la taille du menu augmente. Si je supprime le menu cela fonctionne bien. Je pense que le problème est celui des balises DIV générées par la commande de menu.

Comment changer le code pour que les éléments de navigation gauche et droit apparaissent sur la même ligne?

<table width="100%" cellpadding="0" cellspacing="0">
    <tr id="trBanner" runat="server" style="background-image: url(Images/Header_Blue.jpg); height:124px">
        <td colspan="2"></td>
    </tr>
    <tr id="trMenu" runat="server" style="background-image: url(Images/bluegradient.jpg); background-repeat">
        <td align="left">&nbsp;&nbsp;<asp:HyperLink ID="HyperLink1" ForeColor="White" Font-Names="verdana" Font-Bold="true" Font-Size="10pt" NavigateUrl="~/Summary.aspx" runat="server" style="text-decoration: none">Summary</asp:HyperLink></td>
        <td align="right" >
            <asp:Menu ID="mainMenu" Orientation="Horizontal" runat="server" DataSourceID="siteMapDataSource" style="vertical-align:top">
                <StaticMenuItemStyle CssClass="navnormal" ForeColor="White" ItemSpacing="5"  />
                <StaticHoverStyle CssClass="navhover"  />
                <StaticSelectedStyle CssClass="navselected" />       
                <DynamicMenuStyle CssClass="navnormal" BackColor="white" BorderColor="Black" BorderStyle="Solid" />     
                <DynamicHoverStyle CssClass="navhover" BackColor="Navy" />
            </asp:Menu>
            <asp:SiteMapDataSource ID="siteMapDataSource" runat="server" ShowStartingNode="false" />
        </td>
    </tr>
    <tr id="trRedBar" runat="server" style="background-image: url(Images/redbar.gif); height:9px">
        <td colspan="2"></td>
    </tr>
</table>
Était-ce utile?

La solution

A fini par utiliser FireBug pour découvrir que le problème était causé par l’image incorporée de SkipLink par le contrôle. La définition de la propriété SkipLinkText = " a résolu le problème de mise en forme, mais a pour effet de rompre la fonction de SkipLink. Y a-t-il une autre solution?

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top