Bonjour à tous,

J'ai un asp:Menu lié à un Sitemap.

Pour faire un menu tout joli, tout beau, je veux mettre une image en fond. Le soucis, c'est que l'image est plus ou moins répétée. Comme s'il y avait plusieurs niveaux.

Voici une impression écran de mon soucis:


le code de mon menu:

Site.Master:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
 
<div id="navigation" class="navigation">
        <div class="IEfixForMenu">
            <asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1" 
                Orientation="Horizontal" StaticEnableDefaultPopOutImage="False" StaticMenuItemStyle-CssClass="staticMenu"
                DynamicMenuItemStyle-CssClass="staticMenu">
                <StaticMenuItemStyle CssClass="staticMenu"></StaticMenuItemStyle>
                <StaticSelectedStyle CssClass="staticMenuSel" />
                <DynamicMenuItemStyle CssClass="staticMenu"></DynamicMenuItemStyle>
            </asp:Menu>
            <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="False" />
        </div>
    </div>
Ma CSS:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
.navigation
{
   width:80%;                  
   height:25px;                
   position:fixed;             
   top: 79px;            
}
 
.IEfixForMenu
{
    position:relative;
    top:0px;
}
 
.staticMenu  
{
     width:130px; 
     height: 25px;
     text-align:center; 
     background-image:url('/Website/Styles/Images/menu.png'); 
     background-repeat:no-repeat; 
}
 
.staticMenuSel 
{
    width:130px;  
    height: 25px; 
    text-align:center;
    background-image:url('/Website/Styles/Images/menu_sel.png'); 
    background-repeat:no-repeat; 
}

En enlevant le text-align:center le problème disparait mais alors les textes sont en dehors de mes cases. J'ai essayé avec un padding-left, même soucis.

J'ai voulu contourner le problème en modifiant mon sitemap comme suit

ligne d'origine:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
<siteMapNode url="~/Website/Default.aspx" title="Home">
ajout d'espaces blancs:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
<siteMapNode url="~/Website/Default.aspx" title="&nbsp;&nbsp;Home">
a priori non toléré

Code : Sélectionner tout - Visualiser dans une fenêtre à part
<siteMapNode url="~/Website/Default.aspx" title="  Home">
les espaces ne sont pas affichés