chrome doesn't show up css images

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

  •  25-09-2022
  •  | 
  •  

Question

I have a menu bar which is included in an ascx file, which I've styled with the following css:

.Menu
{ 
    background:transparent url(../images/blueslate_background.gif) repeat-x;
    text-align:center;
    font-family : "lucida grande", tahoma, verdana, arial, sans-serif;
    font-size:12px;
    font-weight:bold;
    border: None 0px #fff !important;
}

.menuhover
{
     color:#fff;background:transparent url(../images/blueslate_backgroundOVER.gif) repeat-x left center;
}

This is my control MenuControl.ascx design source:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="MenuControl.ascx.cs" Inherits="MenuControl" %>
<link rel="stylesheet" href="css/Menu3.css" type="text/css" />
<div id="header" align="center" >
<table width="100%" cellpadding ="0" cellspacing ="0" align="center">
<tr>
<td align="center">
    <asp:Menu ID="Menu1" runat="server" Orientation ="Horizontal"  CssClass="Menu"
        ForeColor ="Black" Width="100%" ScrollDownText="">
     <StaticMenuItemStyle Height ="40px"/>
    <DynamicMenuItemStyle CssClass ="Menu" Height="30px" HorizontalPadding="10px"  />
    <dynamichoverstyle  CssClass ="menuhover"/>
    <StaticHoverStyle CssClass ="menuhover"/>
   <%--<Items>
            <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home" Value="Home">
            </asp:MenuItem>
            <asp:MenuItem NavigateUrl="~/Register.aspx" Text="Register" Value="Register">
            </asp:MenuItem>
<asp:MenuItem Text="Services" Value="Services" NavigateUrl="#">
    <asp:MenuItem Text="Corporate Services" 
        Value="Corporate Services"  NavigateUrl="#"></asp:MenuItem>
    <asp:MenuItem Text="New Item" 
        Value="New Item"></asp:MenuItem>
</asp:MenuItem>
            <asp:MenuItem NavigateUrl="#" Text="Tools" Value="New Item">
                <asp:MenuItem NavigateUrl="#" Text="Lorem ipsum dolor sit amet" 
                    Value="Lorem ipsum dolor sit amet"></asp:MenuItem>
                <asp:MenuItem NavigateUrl="#" Text="Lorem ipsum dolor sit amet" 
                    Value="Lorem ipsum dolor sit amet"></asp:MenuItem>
                <asp:MenuItem Text="Lorem ipsum dolor sit amet" 
                    Value="Lorem ipsum dolor sit amet" NavigateUrl="#">
                </asp:MenuItem>
                <asp:MenuItem Text="Lorem ipsum dolor sit amet" 
                    Value="Lorem ipsum dolor sit amet" NavigateUrl="#"></asp:MenuItem>
                <asp:MenuItem Text="Lorem ipsum dolor sit amet" 
                    Value="Lorem ipsum dolor sit amet" NavigateUrl="#"></asp:MenuItem>
            </asp:MenuItem>
            <asp:MenuItem NavigateUrl="#" Text="Important Links" Value="New Item">
                <asp:MenuItem NavigateUrl="#" Text="Lorem ipsum dolor sit amet" 
                    Value="Lorem ipsum dolor sit amet"></asp:MenuItem>
                <asp:MenuItem Text="Lorem ipsum dolor sit amet" 
                    Value="Lorem ipsum dolor sit amet" NavigateUrl="#"></asp:MenuItem>
                <asp:MenuItem Text="Lorem ipsum dolor sit amet" 
                    Value="Lorem ipsum dolor sit amet" NavigateUrl="#"></asp:MenuItem>
            </asp:MenuItem>
            <asp:MenuItem NavigateUrl="#" Text="Acts" Value="New Item">
                <asp:MenuItem NavigateUrl="#" Text="Lorem ipsum dolor sit amet" 
                    Value="Lorem ipsum dolor sit amet"></asp:MenuItem>
                <asp:MenuItem Text="Lorem ipsum dolor sit amet" 
                    Value="Lorem ipsum dolor sit amet" NavigateUrl="#"></asp:MenuItem>
            </asp:MenuItem>
            <asp:MenuItem Text="Rules" Value="Rules" NavigateUrl="#"></asp:MenuItem>
            <asp:MenuItem Text="Circulars" Value="Circulars" NavigateUrl="#"></asp:MenuItem>
            <asp:MenuItem Text="Notification" Value="Notification" NavigateUrl="#"></asp:MenuItem>
            <asp:MenuItem Text="Forms" Value="Forms" NavigateUrl="#"></asp:MenuItem>
        </Items>--%>
    </asp:Menu>

</td>
</tr>
</table>

The menu display differently dependnent on which browser I use.

1) Chrome: enter image description here

2) Internet Explorer: enter image description here

3) Mozilla: enter image description here

Only Mozilla displays the menu correctly. What am I doing wrong?

Was it helpful?

Solution

ya found solution here link here i have to include this code for chrome

 protected void Page_PreInit(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            if ((Request.UserAgent.IndexOf("AppleWebKit") > 0) || (Request.UserAgent.IndexOf("Unknown") > 0) || (Request.UserAgent.IndexOf("Chrome") > 0))
            {
                Request.Browser.Adapters.Clear();
            }
        }
    }

and For IE8 there is a special hotfix for ASP.NET 2.0. Here is it: http://support.microsoft.com/kb/962351

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top