ASP.Net application differs differently in IIS servers

I deployed the ASP.Net web application on my server in IIS 7.5. It is correctly processed in Firefox and Chrome, but it is not correctly processed in IE 10 or IE 11. When I deployed the same application on my IIS Server computer (development system), it correctly displays IE, Firefox, Chrome and the WebkitBrowser control. So my requirement is to render in the WebkitBrowser control that I used in the form of a desktop application. It also does not display correctly in the WebkitBrowser control. I tried using

<meta http-equiv="X-UA-Compatible" content="IE=8"> 

but failed. I add dword with

UA-Compatible IE=8, IE=9, IE=10 

etc., but still out of luck. It works on my laptop but does not work on the deployment server. I need to display it on a WebkitBrowser control. Class grdarea.css:

.grdarea
{
    float: none;
/*height: 30px;*/
font-size: 14px;
line-height: 0px;
margin: 0 0 0px;
padding: 2px 0;
text-transform: uppercase;
border-radius: 5px;
-webkit-border-radius: 5px;
border: #0e2a3f solid 1px;
 color: #FFFFFF;
box-shadow: 0 0 2px 0 rgba(0,0,0,0.3);
-webkit-box-shadow: 0 0 2px 0 rgba(0,0,0,0.3);
background: #4d73a0;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkNzNhMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjMlIiBzdG9wLWNvbG9yPSIjMzY2MzljIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNyUiIHN0b3AtY29sb3I9IiMzNDYxOWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMCUiIHN0b3AtY29sb3I9IiMzMDYwYTAiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIyMCUiIHN0b3AtY29sb3I9IiMyYzVjOWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIzMCUiIHN0b3AtY29sb3I9IiMyZDU4OGIiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI0NyUiIHN0b3AtY29sb3I9IiMyODRmODYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI2NyUiIHN0b3AtY29sb3I9IiMyMzQ1NzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI5MCUiIHN0b3AtY29sb3I9IiMxYjNhNjgiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI5MyUiIHN0b3AtY29sb3I9IiMxZDNjNmEiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI5NyUiIHN0b3AtY29sb3I9IiMxYzM5NTkiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMWQzYTVhIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(top, #4d73a0 0%, #36639c 3%, #34619a 7%, #3060a0 10%, #2c5c9a 20%, #2d588b 30%, #284f86 47%, #234573 67%, #1b3a68 90%, #1d3c6a 93%, #1c3959 97%, #1d3a5a 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4d73a0), color-stop(3%, #36639c), color-stop(7%, #34619a), color-stop(10%, #3060a0), color-stop(20%, #2c5c9a), color-stop(30%, #2d588b), color-stop(47%, #284f86), color-stop(67%, #234573), color-stop(90%, #1b3a68), color-stop(93%, #1d3c6a), color-stop(97%, #1c3959), color-stop(100%, #1d3a5a));
background: -webkit-linear-gradient(top, #4d73a0 0%, #36639c 3%, #34619a 7%, #3060a0 10%, #2c5c9a 20%, #2d588b 30%, #284f86 47%, #234573 67%, #1b3a68 90%, #1d3c6a 93%, #1c3959 97%, #1d3a5a 100%);
background: -o-linear-gradient(top, #4d73a0 0%, #36639c 3%, #34619a 7%, #3060a0 10%, #2c5c9a 20%, #2d588b 30%, #284f86 47%, #234573 67%, #1b3a68 90%, #1d3c6a 93%, #1c3959 97%, #1d3a5a 100%);
background: -ms-linear-gradient(top, #4d73a0 0%, #36639c 3%, #34619a 7%, #3060a0 10%, #2c5c9a 20%, #2d588b 30%, #284f86 47%, #234573 67%, #1b3a68 90%, #1d3c6a 93%, #1c3959 97%, #1d3a5a 100%);
background: linear-gradient(to bottom, #4d73a0 0%, #36639c 3%, #34619a 7%, #3060a0 10%, #2c5c9a 20%, #2d588b 30%, #284f86 47%, #234573 67%, #1b3a68 90%, #1d3c6a 93%, #1c3959 97%, #1d3a5a 100%);    

}

.grdarea:hover
{

background: #45484d;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA /Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ1NDg0ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #45484d 0%, #000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #45484d), color-stop(100%, #000));
background: -webkit-linear-gradient(top, #45484d 0%, #000 100%);
background: -o-linear-gradient(top, #45484d 0%, #000 100%);
background: -ms-linear-gradient(top, #45484d 0%, #000 100%);
background: linear-gradient(to bottom, #45484d 0%, #000 100%);

}

One of my Page Source Code: 

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="FrmUserLogin.aspx.cs"  Inherits="VisionWebPortal.FrmUserLogin" %>
<%@ Register Assembly="AjaxControlToolkit"  Namespace="AjaxControlToolkit"  TagPrefix="ajaxToolkit" %>
<%@ Register Src="MessageBoxUsc/uscMsgBox.ascx" TagName="uscMsgBox" TagPrefix="uc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Vision Web Tv</title>
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="js/jquery.main.js"></script>
<script src="js/jquery.movingboxes.js"></script>
    <!--[if lt IE 9]><link rel="stylesheet" media="all" href="css/ie.css"  type="text/css"/><![endif]-->
<!--[if IE]><script type="text/javascript" src="js/ie.js"></script><![endif]-->
<style>
.CentereObj1 {float:left;width:50%; height :400px; margin-left:10px; margin-right:auto; margin-top :30px; }
.tbl
{
 width:50%; border-collapse: collapse; margin-top:85px;margin-left:20px;
}
 .tbl td{border: none
         } 
.tbl th{border: none} 
.col 
 {
 }
 .topMargin{ margin-top:50px;}
.TextBoxes{margin:20px 0 20px 0;    }
.LeftF{ float :left ;}
.CenterF { margin:0 auto;}   
</style>
</head>
<body >
<div id="wrapper">
<header id="header">
<h1 class="logo"><a href="#"></a></h1>
<div class="header-holder"></div>
</header> 
<form id="form1" runat="server">
<AjaxControls:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnableScriptGlobalization="true"
    EnableScriptLocalization="true">
</AjaxControls:ToolkitScriptManager>
   <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
<table class ="tbl" >
     <tr>
             <td colspan="3">
                          </td>
             <td colspan="3">

             </td>
         </tr>
         <tr>
             <td  colspan="6">
                 &nbsp;
                 <div class ="LeftF">
                            <asp:Label ID="Label3" runat="server" Text="SIGN IN       " 
                                Font-Bold="True" Font-Size="Larger" Font-Underline="True"></asp:Label>
                                <asp:Label
                                    ID="Label4" runat="server" 
                                Text="                Welcome to Vision Web TV!" Font-Bold="True" 
                                Font-Underline="False"></asp:Label>
                             </div> 
                 </td>
         </tr>
         <tr>
             <td class="style5">
                 <div class ="LeftF">
                 <asp:TextBox ID="username" runat="server" Height="25px" Width="250px"></asp:TextBox>
                 <ajaxToolkit:RoundedCornersExtender ID="rce" runat="server" Corners="All" 
                     Radius="15" TargetControlID="username" />
                     </div> 
                                  </td>
             <td class="style7">
              <div class ="LeftF">
                 <asp:CheckBox ID="chkRememberMe" runat="server" Text="Remember Password?" 
                      TabIndex="3" />
                 </div>
             </td>
             <td class="style2" colspan="2">
                 &nbsp;</td>
             <td class="style2">
                 <asp:Label ID="Label1" runat="server" Visible="False"></asp:Label>
             </td>
             <td class="style1">
                 &nbsp;</td>
         </tr>
         <tr>
             <td class="style5">
              <div class ="LeftF">
                 <asp:TextBox ID="passwd" runat="server" Height="25px" TextMode="Password" 
                     Width="250px" TabIndex="1"></asp:TextBox>
             <ajaxToolkit:RoundedCornersExtender ID="RoundedCornersExtender2" runat="server"
TargetControlID="passwd"
Radius="15"
Corners="All" />
            </div>

             </td>
             <td class="style7">
                 <div class="LeftF">
                     <a href="#">Forgot your password </a>
                 </div>
             </td>
             <td class="style2" colspan="2">
                 &nbsp;</td>
             <td class="style2">
                 &nbsp;</td>
             <td class="style1">
                 &nbsp;</td>
         </tr>
         <tr>
             <td class="style5">
              <div class ="LeftF">
                 <asp:Button ID="Button1" runat="server" BackColor="#999999" CssClass="grdarea" 
                     Font-Size="Large" ForeColor="Black" Height="30px" onclick="Button1_Click" 
                     Text="GO!" Width="250px" TabIndex="2" />
                     </div> 
             </td>
             <td class="style7">
                 &nbsp;</td>
             <td class="style2" colspan="2">
                 &nbsp;</td>
             <td class="style2">
                 &nbsp;</td>
             <td class="style1">
                 &nbsp;</td>
         </tr>
         <tr>
             <td class="style5">
                 <div class="LeftF">
                     <a href="FrmUserRegis.aspx">New User Register Here</a>
                 </div>
             </td>
             <td class="style7">
                 &nbsp;</td>
             <td class="style2" colspan="2">
                 &nbsp;</td>
             <td class="style2">
                 &nbsp;</td>
             <td class="style1">
                 &nbsp;</td>
         </tr>
         <tr>
             <td class="style5" colspan="6">

                 <asp:Label ID="Label2" runat="server" BackColor="#990000"   Font-Bold="False" 
                     Font-Size="Small" ForeColor="White" 
                     Text="System Message| Can be viewed best in 1024x768 resolution, for any query please call at 111-000-222.                                                         " 
                     Width="100%"></asp:Label>

             </br>
             </td>
         </tr>
     </table>
            </div>   
        </div>  
     </ContentTemplate>
       <Triggers>
   <asp:AsyncPostBackTrigger ControlID="Button1" />
    </Triggers> 

            </asp:UpdatePanel>
       <uc1:uscMsgBox ID="uscMsgBox1" runat="server" />
    </form>
</div>        
</body>
</html>

Button1 in this case does not display properly in IE, but displays in Chrome and Firefox.