Thursday, 15 September 2011

css - IE 8 does'nt load html properly -



css - IE 8 does'nt load html properly -

i have problem in website that's getting no nerves. website renders on chrome , firefox, problem on ie (surprise!). when load locally renders fine, disploaying elements should. when load on servert, ignores css rules. , when nail f12 inspect element, doesn't show opening tags of elements, closing ones, strange. i've uploaded files correctly, checked conditional comments, went through lines after typo , found nothing. hope help me this. here website:

palcco.com.br/ftp/kunzler

i hope can help me this. it's rookie error or escaped sight.

thanks in advance.

the code: <html class="no-js"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>index</title> <link rel="stylesheet" href="estilo.css"> <!--<link rel="stylesheet" href="ie.css">--> <link rel="stylesheet" href="facebox.css"> <link rel="stylesheet" href="global.css"> <link rel="stylesheet" href="slider.css"> <meta name="viewport" content="width=device-width"> <!--[if (ie)]> <link rel="stylesheet" href="ie.css" type="text/css"> <!--<![endif]--> <!--[if !(ie)]><!--> <link rel="stylesheet" href="estilo.css" type="text/css" /> <!-- media query 1 --> <link href="estilo.css" rel="stylesheet" type="text/css" media="only screen , (min- width:1600px) , (max-width:1920px)" /> <!-- media query 2 --> <link href="estilo.css" rel="stylesheet" type="text/css" media="only screen , (min- width:1920px)" /> <!--<![endif]--> <script type= "text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> </script> <!--<script src="/js/jquery-1.4.2.min.js"></script>--> <script src="js/smoothscroll.js"></script> <script src="js/jquery.js"></script> <script src="js/easyslider1.7.js"></script> <script src="js/facebox.js" type="text/javascript"></script> <script src="js/valida.js"></script> <!--<script src="pie/pie.js"></script>--> <!--[if lt ie 9]> <script type="text/javascript" src="js/respond.js"></script> <![endif]--> <script type="text/javascript"> var $j = jquery.noconflict(); $(document).ready(function(){ $j(".banner").easyslider({ auto: true, continuous: true, nextid: "slider1next", previd: "slider1prev" }); }); </script> <script type="text/javascript" src="js/modernizr.js"></script> </head> <body> <section id="home"> <header id="topo"> <section class="logo"> <section class="container"> <a href="#"> <h2>kunzler</h2> <img src="img/logo_relevo.fw.png" alt="kunzler"> </a> </section><!--container--> <h1>para tudo que combina com você</h1> </section><!--logo--> <nav id="menu"> <section class="container"> <ul> <li class="menu_princ"><a href="#">menu</a> <ul class="submenu"> <li><a href="#home" class="smoothscroll">home</a></li> <li><a href="empresa.html" class="empresa" rel="facebox">empresa</a></li> <li><a href="#produtos" class="smoothscroll">produtos</a></li> <li><a href="#receitas" class="smoothscroll">receitas</a></li> <li><a href="#filmes" class="smoothscroll">filmes</a></li> <li><a href="#contato" class="smoothscroll">contato</a></li> </ul> </li> </ul> </section><!--container--> </nav> </header> <section class="container_banner"> <section class="banner"> <ul> <li><a href="#"><img src="img/banner1.jpg" alt="" /></a></li> <li><a href="#"><img src="img/banner2.jpg" alt="" /></a></li> <li><a href="#"><img src="img/banner_tropical.jpg" alt="" /></a></li> <li><a href="#"><img src="img/banner_brasileirinho.jpg" alt="" /></a></li> <li><a href="#"><img src="img/banner_defumado.jpg" alt="" /></a></li> </ul> </section> </section> </section><!--home--> <section id="produtos"> <section class="fundo"> <section class="return"> <a href="#home" class="smoothscroll"> <img src="img/arrowhome2.png"/> </a> </section> <h2>produtos</h2> <div id="arrtrabalhos"> <section class="container"> <div class="arrgeral"> <div class="arritens"> <div class="arritem"> <div class="blocomostra blocotop"> <section class="embalagem"> <section class="aba_embalagem"> <h3>tradicional pote</h3> </section> <a href="produto1.html" rel="facebox"> <img src="img2/tradpote.fw.png" alt="tradicional pote"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="embalagem_inf"> <a href="produto2.html" rel="facebox"> <img src="img2/tropicalsache.fw.png" alt="tropical sachê"> </a> <section class="aba_embalagem_inf"> <h3>tropical sachê</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="embalagem"> <section class="aba_embalagem"> <h3>tradicional sachê</h3> </section> <a href="produto3.html" rel="facebox"> <img src="img2/tradsache.fw.png" alt="tradicional sachê"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="embalagem_inf"> <a href="produto4.html" rel="facebox"> <img src="img2/tropicalpote.fw.png" alt="tropical pote"> </a> <section class="aba_embalagem_inf"> <h3>tropical pote</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="embalagem"> <section class="aba_embalagem"> <h3>light sachê</h3> </section> <a href="produto5.html" rel="facebox"> <img src="img2/lightsache.fw.png" alt="light sachê"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="embalagem_inf"> <a href="produto6.html" rel="facebox"> <img src="img2/brasileirinho_emb.fw.png" alt="brasileirinho"> </a> <section class="aba_embalagem_inf"> <h3>brasileirinho</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="embalagem"> <section class="aba_embalagem"> <h3>light pote</h3> </section> <a href="produto7.html" rel="facebox"> <img src="img2/lightpote.fw.png" alt="light pote"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="embalagem_inf"> <a href="produto8.html" rel="facebox"> <img src="img2/defumado_emb.fw.png" alt="defumado"> </a> <section class="aba_embalagem_inf"> <h3>defumado</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="embalagem"> <section class="aba_embalagem"> <h3>orégano</h3> </section> <a href="produto9.html" rel="facebox"> <img src="img2/oreganoemb.fw.png" alt="orégano"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="embalagem_inf"> <a href="produto10.html" rel="facebox"> <img src="img2/massacaseira_emb.fw.png" alt="massa caseira"> </a> <section class="aba_embalagem_inf"> <h3>massa caseira</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="embalagem"> <section class="aba_embalagem"> <h3>batata palha</h3> </section> <a href="produto11.html" rel="facebox"> <img src="img2/batatapalha_emb.fw.png" alt="batata palha"> </a> </section> </div><!--blocomostra blocotop--> </div><!--arritem--> </div><!--arritens--> <div class="arrancora"> <div class="arrbox"> <div class="arrbg"> <div class="arrbt"></div> </div><!--arrbg--> </div><!--arrbox--> </div><!--arrancora--> </div><!--arrgeral--> </section><!--container--> </div><!--arrtrabalhos--> </section><!--fundo--> </section><!--#produtos--> <section id="receitas"> <section class="return"> <a href="#home" class="smoothscroll"> <img src="img/arrowhome.fw.png" /> </a> </section> <h2>receitas</h2> <div id="arrtrabalhos"> <section class="container"> <div class="arrgeral"> <div class="arritens"> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_receitas"> <section class="aba_receitas"> <h3>batata assada</h3> </section> <a href="receita1.html" rel="facebox"> <img src="img/imgbatata.jpg" alt="batata assada"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_receitas_inf"> <a href="receita2.html" rel="facebox"> <img src="imgreceitas/receita_tomatesecos.jpg" alt="tomates secos"> </a> <section class="aba_receitas_inf"> <h3>tomates secos</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_receitas"> <section class="aba_receitas"> <h3>couve-flor</h3> </section> <a href="receita3.html" rel="facebox"> <img src="imgreceitas/receita_couveflor.jpg" alt="couve flor"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_receitas_inf"> <a href="receita4.html" rel="facebox"> <img src="imgreceitas/receita_brigadeiro.jpg" alt="brigadeiro de queijo"> </a> <section class="aba_receitas_inf"> <h3>brigadeiro de queijo</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_receitas"> <section class="aba_receitas"> <h3>panqueca de frango</h3> </section> <a href="receita5.html" rel="facebox"> <img src="imgreceitas/receita_panqueca.jpg" alt="panqueca de frango"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_receitas_inf"> <a href="receita6.html" rel="facebox"> <img src="imgreceitas/receita_pudim.jpg" alt="pudim de leite"> </a> <section class="aba_receitas_inf"> <h3>pudim de leite</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_receitas"> <section class="aba_receitas"> <h3>quiche de queijo</h3> </section> <a href="receita7.html" rel="facebox"> <img src="imgreceitas/receita_quiche.jpg" alt="quiche de queijo"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_receitas_inf"> <a href="receita8.html" rel="facebox"> <img src="imgreceitas/receita_risoto_queijo.jpg" alt="risoto de queijo"> </a> <section class="aba_receitas_inf"> <h3>risoto de queijo</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_receitas"> <section class="aba_receitas"> <h3>fondue de queijo</h3> </section> <a href="receita9.html" rel="facebox"> <img src="imgreceitas/receita_fondue.jpg" alt="fondue de queijo"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_receitas_inf"> <a href="receita10.html" rel="facebox"> <img src="imgreceitas/receita_arroz.jpg" alt="arroz ao forno"> </a> <section class="aba_receitas_inf"> <h3>arroz ao forno</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_receitas"> <section class="aba_receitas"> <h3>atum grelhado</h3> </section> <a href="receita11.html" rel="facebox"> <img src="imgreceitas/receita_atum_grelhado.jpg" alt="atum grelhado"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_receitas_inf"> <a href="receita12.html" rel="facebox"> <img src="imgreceitas/receita_capeletti.jpg" alt="capeletti de forno"> </a> <section class="aba_receitas_inf"> <h3>capeletti de forno</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_receitas"> <section class="aba_receitas"> <h3>empadão de queijo</h3> </section> <a href="receita13.html" rel="facebox"> <img src="imgreceitas/receita_empadao.jpg" alt="empadão de queijo"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_receitas_inf"> <a href="receita14.html" rel="facebox"> <img src="imgreceitas/receita_frango_queijo.jpg" alt="frango ao queijo parmesão"> </a> <section class="aba_receitas_inf"> <h3>frango ao queijo</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_receitas"> <section class="aba_receitas"> <h3>nhoque de queijo</h3> </section> <a href="receita15.html" rel="facebox"> <img src="imgreceitas/receita_nhoque.jpg" alt="nhoque de queijo"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_receitas_inf"> <a href="receita16.html" rel="facebox"> <img src="imgreceitas/receita_torta_doce.jpg" alt="torta doce de queijo"> </a> <section class="aba_receitas_inf"> <h3>torta de queijo</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_receitas"> <section class="aba_receitas"> <h3>pão de queijo</h3> </section> <a href="receita17.html" rel="facebox"> <img src="imgreceitas/receita_pao_queijo.jpg" alt="pão de queijo parmesão"> </a> </section> </div><!--blocomostra blocotop--> </div><!--arritem--> </div><!--arritens--> <div class="arrancora"> <div class="arrbox"> <div class="arrbg"> <div class="arrbt"></div> </div><!--arrbg--> </div><!--arrbox--> </div><!--arrancora--> </div><!--arrgeral--> </section><!--container--> </div><!--arrtrabalhos--> </section><!--receitas--> <section id="filmes"> <section class="fundo"> <section class="return"> <a href="#home" class="smoothscroll"> <img src="img/arrowhome2.png"/> </a> </section> <h2>filmes</h2> <div id="arrtrabalhos"> <section class="container"> <div class="arrgeral"> <div class="arritens"> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_filmes"> <section class="aba_filmes"> <h3>kunzler light</h3> </section> <a href="filme1.html" rel="facebox"> <img src="imgvideo/video1.jpg" alt="kunzler light"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_filmes_inf"> <a href="filme2.html" rel="facebox"> <img src="imgvideo/video2.jpg" alt="kunzler orégano"> </a> <section class="aba_filmes_inf"> <h3>kunzler orégano</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_filmes"> <section class="aba_filmes"> <h3>tropical</h3> </section> <a href="filme3.html" rel="facebox"> <img src="imgvideo/video3.jpg" alt="tropical"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_filmes_inf"> <a href="filme4.html" rel="facebox"> <img src="imgvideo/video4.jpg" alt="boas festas"> </a> <section class="aba_filmes_inf"> <h3>boas festas</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_filmes"> <section class="aba_filmes"> <h3>canal kunzler</h3> </section> <a href="filme5.html" rel="facebox"> <img src="imgvideo/video5.jpg" alt="canal kunzler"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_filmes_inf"> <a href="filme6.html" rel="facebox"> <img src="imgvideo/video6.jpg" alt="pipoca e pão de queijo"> </a> <section class="aba_filmes_inf"> <h3>pipoca e pão de queijo</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_filmes"> <section class="aba_filmes"> <h3>arroz de forno</h3> </section> <a href="filme7.html" rel="facebox"> <img src="imgvideo/video7.jpg" alt="arroz de forno"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_filmes_inf"> <a href="filme8.html" rel="facebox"> <img src="imgvideo/video8.jpg" alt="kunzler 50 anos"> </a> <section class="aba_filmes_inf"> <h3>kunzler 50 anos</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_filmes"> <section class="aba_filmes"> <h3>cachorro-quente especial</h3> </section> <a href="filme9.html" rel="facebox"> <img src="imgvideo/video9.jpg" alt="cachorro quente especial"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_filmes_inf"> <a href="filme10.html" rel="facebox"> <img src="imgvideo/video10.jpg" alt="lasanha tropical"> </a> <section class="aba_filmes_inf"> <h3>lasanha tropical</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> <div class="arritem"> <div class="blocomostra blocotop"> <section class="box_filmes"> <section class="aba_filmes"> <h3>pizza no pão</h3> </section> <a href="filme11.html" rel="facebox"> <img src="imgvideo/video11.jpg" alt="pizza no pão"> </a> </section> </div><!--blocomostra blocotop--> <div class="blocomostra blocobottom"> <section class="box_filmes_inf"> <a href="filme12.html" rel="facebox"> <img src="imgvideo/video12.jpg" alt="kunzler"> </a> <section class="aba_filmes_inf"> <h3>kunzler</h3> </section> </section> </div><!--blocomostra blocobottom--> </div><!--arritem--> </div><!--arritens--> <div class="arrancora"> <div class="arrbox"> <div class="arrbg"> <div class="arrbt"></div> </div><!--arrbg--> </div><!--arrbox--> </div><!--arrancora--> </div><!--arrgeral--> </section><!--container--> </div><!--arrtrabalhos--> </section><!--fundo--> </section><!--filmes--> <section id="contato"> <section class="container"> <section class="return"> <a href="#home" class="smoothscroll"> <img src="img/arrowhome.fw.png" /> </a> </section> <h2>contato</h2> <section class="form"> <section class="campos"> <form onsubmit="return valida(this);" action="enviar_contato.php" method="post"> <input type="text" name="nome" value="nome" onclick="this.value='';" onblur="javascript:if (this.value=='') {this.value='nome'};"/> <!--<p>&nbsp;</p>--> <input type="text" name="telefone" value="telefone" onclick="this.value='';" onblur="javascript:if (this.value=='') {this.value='telefone'};"/> <!--<p>&nbsp;</p>--> <input type="text" name="email" value="e-mail" onclick="this.value='';" onblur="javascript:if (this.value=='') {this.value='e- mail'};"/> <!--<p>&nbsp;</p>--> </section><!--campos--> <section class="mensagem"> <textarea class="cxtxt" name="mensagem" value="mensagem" onclick="this.value='';" onblur="javascript:if (this.value=='') {this.value='mensagem'};">mensagem</textarea> <input type="submit" name="submit" value="ok" onclick="valida()"/></input> </form> </section><!--mensagem--> <section id="novidades"> <section class="container"> <h4>novidades</h4> <form onsubmit="return valida(this);" action="enviar_novidades.php" method="post"> <input type="text" name="novidades" value="e-mail" onclick="this.value='';" onblur="javascript:if (this.value=='') {this.value='e-mail'};"/> <input name="enviar" type="submit" value="ok" /> </form> </section> </section> <section id="socialmedia"> <section class="socialmediaicon"> <a href="https://www.facebook.com/queijokunzler" target="_blank"> <img src="img/facebook.png" alt="facebook"> </a> <a href="https://www.youtube.com/user/tvkunzler" target="_blank"> <img src="img/youtube.png" alt="youtube"> </a> <a href="https://twitter.com/queijokunzler" target="blank"> <img src="img/twitter.png" alt="twitter"> </a> <a href="www.instagram/queijokunzler" target="blank"> <img src="img/twitter.png" alt="instagram"> </a> <h4><span>rede</span> <br>social</h4> </section><!--socialmediaicon--> </section><!--socialmedia--> </section><!--form--> </section><!--container--> </section><!--contato--> <footer id="rodape"> <section id="fundo_rodape"> <nav id="menu_rodape"> <section class="container"> <ul> <li><a href="#home" class="smoothscroll">home</a></li> <li><a href="#produtos" class="smoothscroll">produtos</a></li> <li><a href="#receitas" class="smoothscroll">receitas</a></li> <li><a href="#filmes" class="smoothscroll">filmes</a></li> <li><a href="#contato" class="smoothscroll">contato</a></li> </ul> </section> </nav> <section class="trabalho"> <a href="trabalhe.html" class="trabalhe" rel="facebox"><p>trabalhe conosco</p></a> </section> <p>todos os direitos reservados à kunzler<br> fale conosco: 51 3382.9000 |<br /> kunzler@kunzler.com.br</p> <section id="logo_rodape"> <img src="img/logo_relevo_rodape.fw.png" alt=""> </section> <section id="logo50"> <img src="img/50anos.jpg" alt=""> </section> </section><!--fundo_rodape--> </footer> </body> </html>

try adding doctype, document appears missing one. see these articles: http://alistapart.com/article/doctype , http://www.w3.org/qa/tips/doctype.

chrome , firefox typically more forgiving of these types of errors – while ie8 , below not.

html css

No comments:

Post a Comment