Comunidad de diseño web y desarrollo en internet online

Problema con IE7

Citar            
MensajeEscrito el 24 Feb 2012 09:21 pm
Hola a todos.

Tengo el siguiente problema, estoy haciendo un site para mi jefe (que siempre usa IE7) el cual me salen verticales los divs. Dreamweaver no me muestra errores en la compatibilidad de Navegadores, pero en el IE me salen verticales. (en FF me sale perfecto). Ya probé con varias clases como el display in-line pero no me sale.

Envio los códigos para verlos:

Código HTML :

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Ven a vivir la Makromania | Makro Colombia</title>
<link rel="stylesheet" href="css/estilos_mm2012.css" type="text/css" media="screen" />
<!--ROCKBOX -->
<link href="rokbox/styles/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="rokbox/mootools-release-1.11.js"></script>
<script type="text/javascript" src="rokbox/rokbox.js"></script>
<link href="rokbox/themes/light/rokbox-style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="rokbox/themes/dark/rokbox-config.js"></script>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>

<!--[if IE 6]>
<link rel="stylesheet" href="css/ie6.css" type="text/css" media="all" />
<![endif]-->

<!--[if lte IE 7]>
<style type="text/css">
html .jqueryslidemenu{height: 1%;} /*Holly Hack for IE7 and below*/
</style>
<![endif]-->
</head>

<body>
<div id="contenedor">
   <section>
         <div class="menu_def">
         <ul>
            <li><img src="images/menu_home.gif"></li>
            <li><img src="images/menu_mp.gif"></li>
            <li><img src="images/menu_contacto.gif"></li>
         </ul>   
         </div>      
<article class="imagen_resto"><img src="images/top_imagen_resto.jpg" alt="01"></article>
      </section>
      <div class="clear"></div>
   </section>
<section class="flash">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="1024" height="125" id="FlashID" title="rotor">
      <param name="movie" value="menu_site.swf">
      <param name="quality" value="high">
      <param name="wmode" value="transparent">
      <param name="swfversion" value="11.0.0.0">
      <!-- Esta etiqueta param indica a los usuarios de Flash Player 6.0 r65 o posterior que descarguen la versión más reciente de Flash Player. Elimínela si no desea que los usuarios vean el mensaje. -->
      <param name="expressinstall" value="Scripts/expressInstall.swf">
      <!-- La siguiente etiqueta object es para navegadores distintos de IE. Ocúltela a IE mediante IECC. -->
      <!--[if !IE]>-->
      <object type="application/x-shockwave-flash" data="menu_site.swf" width="1024" height="125">
        <!--<![endif]-->
        <param name="quality" value="high">
        <param name="wmode" value="transparent">
        <param name="swfversion" value="11.0.0.0">
        <param name="expressinstall" value="Scripts/expressInstall.swf">
        <!-- El navegador muestra el siguiente contenido alternativo para usuarios con Flash Player 6.0 o versiones anteriores. -->
        <div>
          <h4>El contenido de esta página requiere una versión más reciente de Adobe Flash Player.</h4>
          <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Obtener Adobe Flash Player" /></a></p>
        </div>
        <!--[if !IE]>-->
      </object>
      <!--<![endif]-->
    </object>
</section>
    <section class="caja_textos">
        <article class="cajas_contenidos">
      <div><img src="images/titulos_borrar.jpg" alt="titulos"></div>
      <div>Textos</div>
      </article>
      
        <article class="cajas_contenidos">
      <div><img src="images/titulos_borrar.jpg" width="220" height="25" alt="titulos"></div>
      <div>Textos</div>
      </article>
      
      <article class="cajas_contenidos">
      <div><img src="images/titulos_borrar.jpg" width="220" height="25" alt="titulos"></div>
      <div>Textos</div>
      </article>
      
      <article class="cajas_contenidos">
      <div><img src="images/titulos_borrar.jpg" width="220" height="25" alt="titulos"></div>
      <div>Textos</div>
      </article>
   <div class="clear"></div>   
  </section>

</body>
</html>

LAS HOJAS DE ESTILO

[code:1:be257094bc]
body{margin:0; padding:0;}
#contenedor{width:1024px; margin:auto; padding:0px; background:#DDDDDD;}
.contenedor_uno{width:1024px;}
.right_menu{height:38px; width:450px; float:left;}
.menu_def{width:424px; height:36px; background:url(../images/bg_menu.jpg) no-repeat; vertical-align:central; padding-left:600px;}
/*424 del ancho + 600 del padding = 1024 del ancho total*/

ul li {list-style-type:none; float:left; line-height:0;}
.imagen_resto{width:1024; height:386px; background:#999933;}

.botones{width:1024px; height:125px; float:left; margin:0px; background:red;}

.clear{clear:both;}

.caja_textos{height:400px; background:url(../images/bg_contenidos.jpg) no-repeat;}
.cajas_contenidos{height:120px; margin:25px 27px 0px 8px; background:red; float:left; display:inline;}

[/code:1:be257094bc]


Gracias

Por diego2008kat

95 de clabLevel



 

Diseñador

firefox
Citar            
MensajeEscrito el 01 Mar 2012 07:42 am
¿Por qué estás lanzando todo a la izquierda (float:left;)? No se si influya en tu compatibilidad con IE7 (dile a tu jefe que apesta), pero si tienes elementos que van primero al flotar, mándalos a la derecha o izquierda respectivamente.

Por Kinduff

Claber

3563 de clabLevel

21 tutoriales
3 articulos

 

web dev wizzard

chrome
Citar            
MensajeEscrito el 01 Mar 2012 02:09 pm
Ya lo intente .... y la solución fue trabajar todo como HTML normal y funcionó bien en todos los navegadores...

Gracias

Por diego2008kat

95 de clabLevel



 

Diseñador

firefox
Citar            
MensajeEscrito el 01 Mar 2012 04:33 pm
Oops! Se me pasó eso, descarga este hack para que los navegadores viejos reconozcan las etiquetas nuevas de HTML5.

Código :

<!--[if lte IE 8]>
<script src="http://remysharp.com/downloads/html5.js" type="text/javascript"></script>
<![endif]-->

Por Kinduff

Claber

3563 de clabLevel

21 tutoriales
3 articulos

 

web dev wizzard

chrome

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.