Hej! Oj, du får nog öva på din css känns det som. No affence. No affence!CSS problem med usercontrol och asp:menu
Bakgrund:
På mina sidor så använder jag en usercontroll som huvud. I controllen har jag en asp:menu och här är koden för den:
<code>
<asp:Menu ID="Menu1" runat="server" BackColor="#A60000" DynamicEnableDefaultPopOutImage="false"
DynamicVerticalOffset="6" Font-Bold="True" Font-Names="Verdana" Font-Size="10pt"
ForeColor="White" Orientation="Horizontal" StaticEnableDefaultPopOutImage="false"
Width="859px">
<StaticMenuStyle HorizontalPadding="3px" VerticalPadding="2px" />
<DynamicHoverStyle BackColor="#404040" BorderColor="White" BorderStyle="Dashed" BorderWidth="1px"
Font-Underline="False" ForeColor="Yellow" />
<DynamicMenuStyle BackColor="Black" BorderColor="White" BorderStyle="None" BorderWidth="1px"
HorizontalPadding="3px" VerticalPadding="1px" />
<DynamicMenuItemStyle BackColor="Black" BorderColor="White" BorderStyle="Solid" BorderWidth="1px"
Font-Bold="True" Font-Names="Verdana" Font-Size="10pt" HorizontalPadding="6px"
ItemSpacing="1px" VerticalPadding="1px" Width="125px" />
<Items>
<asp:MenuItem NavigateUrl="~/Default.aspx" Text="Start" Value="Start"></asp:MenuItem>
<asp:MenuItem Selectable="False" Text="Klubben" Value="Styrelsen">
<asp:MenuItem Text="Styrelsen" Value="Styrelsen" NavigateUrl="~/border.aspx"></asp:MenuItem>
<asp:MenuItem Text="Kontakt" Value="Kontakt" NavigateUrl="~/contact.aspx"></asp:MenuItem>
<asp:MenuItem Text="Spela i Grizzlys" Value="Spela i Grizzlys" NavigateUrl="~/play.aspx"></asp:MenuItem>
<asp:MenuItem Text="Shoppen" Value="Shoppen" NavigateUrl="~/shoppen.aspx"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Selectable="False" Text="A-laget" Value="A-laget">
<asp:MenuItem Text="Laget" Value="Laget" NavigateUrl="~/Team/default.aspx?teamid=6"></asp:MenuItem>
<asp:MenuItem Text="Spelschema" Value="Spelschema"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Selectable="False" Text="Juniorer" Value="Juniorer">
<asp:MenuItem Text="J18" Value="J18" NavigateUrl="~/Team/default.aspx?teamid=4"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Selectable="False" Text="Ungdom" Value="Ungdom">
<asp:MenuItem Text="U8" Value="U8" NavigateUrl="~/Team/default.aspx?teamid=2"></asp:MenuItem>
<asp:MenuItem Text="U9" Value="U9" NavigateUrl="~/Team/default.aspx?teamid=3"></asp:MenuItem>
<asp:MenuItem Text="U10" Value="U10" NavigateUrl="~/Team/default.aspx?teamid=11"></asp:MenuItem>
<asp:MenuItem Text="U11" Value="U11" NavigateUrl="~/Team/default.aspx?teamid=10"></asp:MenuItem>
<asp:MenuItem Text="U12" Value="U12" NavigateUrl="~/Team/default.aspx?teamid=12"></asp:MenuItem>
<asp:MenuItem Text="U13" Value="U13" NavigateUrl="~/Team/default.aspx?teamid=9"></asp:MenuItem>
<asp:MenuItem Text="U14" Value="U14" NavigateUrl="~/Team/default.aspx?teamid=8"></asp:MenuItem>
<asp:MenuItem Text="U16" Value="U16" NavigateUrl="~/Team/default.aspx?teamid=7"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem NavigateUrl="~/Team/default.aspx?teamid=13" Text="Skridskoskolan" Value="Skridskoskolan">
</asp:MenuItem>
<asp:MenuItem NavigateUrl="~/Team/default.aspx?teamid=14" Text="Konståkning"
Value="Konståkning"></asp:MenuItem>
<asp:MenuItem NavigateUrl="~/Calendar/Default.aspx" Text="Veckoprogram" Value="Veckoprogram">
</asp:MenuItem>
<asp:MenuItem Text="Länkar" Value="Länkar"></asp:MenuItem>
</Items>
<StaticHoverStyle BackColor="#A60000" BorderColor="White" BorderStyle="None" BorderWidth="1px"
Font-Bold="True" Font-Names="Verdana" Font-Size="10pt" Font-Underline="False"
ForeColor="Yellow" />
<StaticMenuItemStyle HorizontalPadding="6px" ItemSpacing="2px" VerticalPadding="2px" />
</asp:Menu>
</code>
Mitt problem är följande:
Jag har kopplat ett stylesheet till min sida som hämtar in usercontrolen. I CSS har jag då
ex:
<code>
a.Grid:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#A60000 ;
font-weight: bold;
text-decoration: none;
}
a.Grid:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color:#A60000;
text-decoration: underline;
}
a.Grid {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#A60000 ;
font-weight: bold;
text-decoration: none;
}
</code>
i ett försök att försöka styra hur länkar skall se ut. om jag i CSS lägger till en
<code>
a:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#A60000 ;
font-weight: bold;
text-decoration: none;
}
a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color:#A60000;
text-decoration: underline;
}
a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#A60000 ;
font-weight: bold;
text-decoration: none;
}
</code>
så får asp:menu spratt men länkarna på sidan fungerar som de skal dvs de är i rätt färg och att det blir en underline vid hover. Asp:menu blir helt tokig och länkarnas utseende blir åt helvete. Men tar jag bort ovan exempel så fungerar menyn men länkarna på sidan blir då(klassiska html länkar) blåa och lila med ett streck under.
Jag har provat att skapat en a.Menu:link mm, och kopplat den till class för asp:menu men det fungerar inte. jag behöver lite hjälp hur jag skall få detta att fungera.
/tyronneSv: CSS problem med usercontrol och asp:menu
Jag ser ingen skillnad på grid-länkarna och de standardlänkarna...
men så här tycker jag du skall göra.
<code>
a {
/* font-family och storlek behöver du inte då du förhoppningsvis har samma typsnitt och storlek på "föräldern */
color:#A60000 ;
font-weight: bold;
text-decoration: none;
}
a:hover {
text-decoration: underline;
} /* även:hover ärver från föräldern a */
/* när det gäller grid tycker jag inte att du skall sätta klass på länkarna i grid, utan hellre på föräldern */
div.grid a { /* div behöver du inte ha */
font-weight: normal; /* dessa länkar skiljer sig från de vanliga */
color: red;
text-decoration: normal;
}
div.grid a:hover{ /* div behöver du inte ha */
text-decoration: underline;
}
</code>
hänger du med?Sv:CSS problem med usercontrol och asp:menu
Jag skall gå igenom CSS en enl dina direktiv. Återkommer
/Tyronne