Usuário com melhor resposta
CSS Nao Aplica No IE10

Pergunta
-
Olá Galera,
Meu problema é o seguinte, tenho uma aplicação rodando legal a não ser pelo css que não funciona corretamente no IE10, mas isso só ocorre quando subo a aplicação para o servidor.
por exemplo tenho minha pagina principal no chorme fica assim:
Ja no IE10
coloco aqui tbm o codigo css e da pagina acima:
body { background: #ebebeb; } #Main_Content { width: 1000px; height: auto; margin: 0 auto; margin-top: 0px; border-radius: 10px; padding: 5px; font-family: 'Segoe UI'; background: #ebebeb; } #mainLayout { width: 1000px; height: 92px; } #logo { width: 266px; height: 82px; float: left; } #topMenu { width: 732px; height: 82px; float: right; } #welcomeLogout { height: auto; width: 300px; text-align: right; font-family:'Segoe UI'; font-size: 15px; margin: 5px 10px 0px 420px; } #title { height: auto; width: 700px; margin: 0px 0px 0px 10px; text-align: left; font-family: 'Segoe UI'; font-size: 18px; font-style: italic; font-weight: bold; } #bottomMenu { height: auto; width: 700px; margin: 5px 0px 0px 20px; text-align: right; font-family: 'Segoe UI'; font-size: 16px; } #mainMenu { width: 1000px; height: 30px; border: 1px solid #000000; border-radius: 10px; background: #E15154; /*para browsers sem suporte a CSS 3*/ background: -ms-linear-gradient(top, #E15154 1%,#951A1D 100%); /*IE10+ */ background: -webkit-gradient(linear, left top, left bottom, from(#E15154), to(#951A1D)); /* webkit browsers */ background: -moz-linear-gradient(top, #E15154, #951A1D); /*Firefox 3.6+ */ text-align: left; line-height: 25px; font-family:'Segoe UI'; margin: 0 auto; } #contentPage { width: 990px; height: auto; border: 1px solid #e5e5e5; margin: 0 auto; margin-top: 10px; border-radius: 15px; padding: 5px; box-shadow: 2px 2px 10px 5px #ccc; font-family:'Segoe UI'; background: #fff; } #footer { width: 1000px; height: auto; font-family:'Segoe UI'; font-size: 14px; text-align: center; margin: 10px 0px 0px 0px; } .ddlBusiness { font-family: 'Segoe UI'; border-radius:5px; background: transparent; border:1px solid #ccc; display: inline-block; -webkit-appearance: none; -moz-appearance: none; border: solid #9A9A9A 0px; list-style-type:none; } .hl_Logout { font-family: 'Segoe UI'; text-align: left; color: #000000; text-decoration: none; } .MainMenuClass { color: #000000; font-family: 'Segoe UI'; font-size: 14px; }
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Main.master.cs" Inherits="PortalColaborador.MasterPage.Main" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <asp:ContentPlaceHolder ID="head" runat="server"> </asp:ContentPlaceHolder> <!-- links para css --> <link href="~/Content/Style/Default.css" rel="stylesheet" type="text/css" /> <link href="~/Content/Style/Error.css" rel="stylesheet" type="text/css" /> <link href="~/Content/Style/Main.css" rel="stylesheet" type="text/css" /> <link href="~/Content/Style/Graphs.css" rel="stylesheet" type="text/css" /> <link href="~/Content/Style/changePassword.css" rel="stylesheet" type="text/css" /> <link href="~/Content/Style/Report.css" rel="stylesheet" type="text/css" /> </head> <body> <form id="form1" runat="server"> <div id="Main_Content"> <div id="mainLayout"> <div id="logo"> <img src="../../Content/Img/LogoPequeno.png" /> </div><!-- Fim logo --> <div id="topMenu"> <div id="welcomeLogout"> Bem Vindo <asp:LoginName ID="LoginName1" runat="server" /> | <asp:HyperLink ID="hl_logout" runat="server" CssClass="hl_Logout" NavigateUrl="~/Page/Logout/logout.aspx">Logout</asp:HyperLink>   <img src="../../Content/Img/logout.png" /> </div><!-- Fim welcomeLogout --> <div id="title"> Portal do Colaborador </div><!-- Fim title --> <div id="bottomMenu"> <asp:DropDownList ID="ddl_company" runat="server" CssClass="ddlBusiness" AutoPostBack="True" OnSelectedIndexChanged="ddl_company_SelectedIndexChanged"> </asp:DropDownList> </div> <!-- Fim bottomMenu --> </div><!-- Fim topMenu --> </div><!-- Fim mainLayout --> <div id="mainMenu"> <asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataMainMenu" Orientation="Horizontal" StaticDisplayLevels="2" Font-Names="Segoe UI" Font-Size="14px" ForeColor="Black"> <DynamicHoverStyle BackColor="#E15154" Font-Names="Segoe UI" Font-Size="14px" ForeColor="White" /> <DynamicMenuItemStyle BackColor="#E15154" Font-Names="Segoe UI" Font-Size="14px" ForeColor="White" /> <DynamicSelectedStyle Font-Names="Segoe UI" Font-Size="14px" ForeColor="White" /> <StaticHoverStyle Font-Names="Segoe UI" ForeColor="White" Height="29px" /> <StaticMenuItemStyle Font-Names="Segoe UI" Font-Size="14px" ForeColor="White" Height="29px" /> <StaticMenuStyle Height="29px" HorizontalPadding="10px" Width="990px" /> <StaticSelectedStyle Font-Names="Segoe UI" Font-Size="14px" ForeColor="White" Height="29px" /> </asp:Menu> <asp:SiteMapDataSource ID="SiteMapDataMainMenu" runat="server" /> </div><!-- Fim mainMenu --> <div id="contentPage"> <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> </asp:ContentPlaceHolder> </div><!-- Fim contentPage --> <div id="footer"> 2012 - Portal do Colaborador Close-Up International </div> </div><!-- Fim Main_Content --> </form> </body> </html>
Respostas
-
Boa noite,
Está parecendo um problema na configuração do IIS do seu server. Um workaround para resolver o problema seria adicionar essa tag no head do seu html:
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
Ela força compatibilidade com IE.
- Editado Filipe Augusto Lima de Souza sexta-feira, 16 de agosto de 2013 02:06
- Marcado como Resposta Andre Germiniani sexta-feira, 16 de agosto de 2013 12:50
Todas as Respostas
-
Boa noite,
Está parecendo um problema na configuração do IIS do seu server. Um workaround para resolver o problema seria adicionar essa tag no head do seu html:
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
Ela força compatibilidade com IE.
- Editado Filipe Augusto Lima de Souza sexta-feira, 16 de agosto de 2013 02:06
- Marcado como Resposta Andre Germiniani sexta-feira, 16 de agosto de 2013 12:50
-
Utilizo CSS 3 no IE sem problemas, cada browser exibe o layout de forma diferente, pois os recursos de compatibilidade entre os mesmo são implementados de acordo com a necessidade do fabricante.
Atenciosamente, Marcio Nogueira Cardoso Pinto.
-
Utilizo CSS 3 no IE sem problemas, cada browser exibe o layout de forma diferente, pois os recursos de compatibilidade entre os mesmo são implementados de acordo com a necessidade do fabricante.
Não é um problema com o CSS. Se você ler o CSS dele está explícito que ele se preocupou com as especificidades de cada browser.
Atenciosamente, Marcio Nogueira Cardoso Pinto.
-
Boa noite,
Está parecendo um problema na configuração do IIS do seu server. Um workaround para resolver o problema seria adicionar essa tag no head do seu html:
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
Ela força compatibilidade com IE.
Cara, você me ajudou muuuuuuuito! Tive o mesmo tipo de problema, gastei HORAS brigando com o meu css, atrasei o projeto, mas finalmente, você resolveu. obrigado mesmo!