El menu no se me ve en INTERNET EXPLORER 9 y en FIREFOX SI

[illera]

Hola tengo un problema con un menu que en el IE 9 no se me ve el menu en cambio en el IE 8 y Firefox si este es el codigo html:

<div class="menu">
<ul>
<a href="home.html" class="active"><span>Home</span></a>
<li><a href="index.html"><span>Conocenos</span></a></li>
<li><a href="tratamientos.html"><span> Tratamientos</span></a></li>
<li><a href="precios.html"><span> Precios</span></a></li>
<li><a href="contact.html"><span> Contacto </span></a></li>
</ul>
</div>

y el css es:

/*menu*/
.menu { padding:1px 0 0 0; margin:0 auto; width:980px;}
.menu ul { text-align: left; padding:0; list-style:none; border:0; float:right; width:520px;}
.menu ul li { float:left; margin:0; padding:30px 5px; border:0; }
.menu ul li a { float:left; margin:0; padding:15px 0 15px 0; color:#fc0000; font:bold 12px "Trebuchet MS", Arial, Helvetica, sans-serif; text-decoration:none; text-transform:uppercase; }
.menu ul li a span { padding:13px 10px; background:none;}
.menu ul li a:hover {background: url(images/r_menu.png) no-repeat right; }
.menu ul li a.active {background:url(images/r_menu.png) no-repeat right; }

Gracias Un Saludo

[afrika026]

Los <span> estan de más, y esto puede generar una incopatibilidad con algunos navegadores.
Tene en cuenta que el atributo <span> se utiliza generalmente para cambiar estilos en determinados lugares de un texto.

el codigo html quedaria así:

<div class="menu">
<ul>
<li><a href="index.html">Conocenos</a></li>
<li><a href="tratamientos.html">Tratamientos</a></li>
<li><a href="precios.html">Precios</a></li>
<li><a href="contact.html">Contacto</a></li>
</ul>
</div>

[Carlos19]

Tu usas un menú muy parecido al mío y tampoco se me muestra en ningún ie

[emprear]

Ese menu, y me refiero exclusivamente al códig que mostrás, si se ve en IE, obviamente se ve mal porque no podés poner esa etiqueta <a> dentro del ul, por el resto, no sé cual es el inconveniente.

Saludos

[illera]

Hola muchas gracias por contestar:

1- Los span los he quitado y sigue dandome el mismo problema
2- Emprear si me puedes especificar tu mensaje con lo da <a> o ayudar, perdona pero soy un poco novato en este tema de web

[vgonga1986]

A lo que se refiere es que tienes un ul y dentro un a sin li:
Cambia esto <a href="home.html" class="active"><span>Home</span></a> por esto:

<li><a href="home.html" class="active"><span>Home</span></a></li>

[illera]

Gracias pero por lo visto me ekivocaria el escribirlo pero si k lo tengo escrito asi como me dices, pero aun sigue sin verse el texto con intenet explorer 9.

[emprear]

Se ve perfectamente

http://foros.emprear.com/css/menu/menu.html
(Comprobado con IE --> 7/8/9/10pp)

a no ser que el código que estas pasando sea sólo un fragmento, por lo que el problema puede estar en esl resto de tu html.

Si no, la otra posibilidda es alguna configuración equivocada en tu Windows/IE

Saludos

[PedroDesing]

el menu se ve perfectamente, el problema debe estar en el div contenedor o algo asi, muestranos el codigo completo :)

Saludos.

[illera]

El enlace que se ve me sale bien pero en la web: www.rhbodyzen.com no me sale permite ejecutar el control activeX y al darle a Permitir SE OCULTA

CODIGO ENTERO STYLE CSS:

@charset "utf-8";
body { margin:0; padding:0; width:100%;}
html { padding:0; margin:0;}

.main { margin:0 auto; padding:0; background: #fff url(images/main_bg.gif) top repeat-x;}
.main2 { margin:0 auto; padding:0; background: #fff url(images/main2_bg.gif) top repeat-x;}
/********** header **********/
.header { padding:0; margin:0 auto; width:980px;}
/* logo */
.logo {padding:0; margin:0; width:335px; float:left;}
/* rss */
.rss { text-align:left; margin:0; padding:25px 0 0 0; font: normal 12px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#737373; line-height:1.8em;}
.rss img.rsss { float:right; margin:5px 2px 0 1px; padding:0;}
/* Click */
.Click { width:250px; float:left; padding:0; margin:0; font: normal 11px Arial, Helvetica, sans-serif; color:#7e7e7e; line-height:1.8em;}
/*menu*/
.menu { padding:1px 0 0 0; margin:0 auto; width:980px;}
.menu ul { text-align: left; padding:0; list-style:none; border:0; float:right; width:520px;}
.menu ul li { float:left; margin:0; padding:30px 5px; border:0; }
.menu ul li a { float:left; margin:0; padding:15px 0 15px 0; color:#fc0000; font:bold 12px "Trebuchet MS", Arial, Helvetica, sans-serif; text-decoration:none; text-transform:uppercase; }
.menu ul li a span { padding:13px 10px; background:none;}
.menu ul li a:hover {background: url(images/r_menu.png) no-repeat right; }
.menu ul li a.active {background:url(images/r_menu.png) no-repeat right; }
/* body */
.body_resize { width:980px; margin:0 auto; padding:0;}
.body { padding:10px 0; margin:0 auto; background:#fff;}
.body h2 { font: bold 18px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#1e1e1e; padding:10px 0 23px 0; margin:0; background:url(images/h2_bg.gif) bottom center no-repeat;}
.body h3 { font: bold 18px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#1e1e1e; padding:10px 0; margin:0;}
.body h2 span { font: bold 13px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#979797; padding:0; margin:0;}
.body .menu2 { width:170px; float:right; padding:0; margin:0;}
.body .menu2 a { font: bold 12px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#5d5d5d; text-decoration:none;}
.body .menu2 a:hover { color:#27619c; text-decoration:underline;}
.body p { font:normal 12px Arial, Helvetica, sans-serif; color:#979797; line-height:1.8em; padding:10px 0; margin:0;}
.body a { color:#c92806; text-decoration:none;}
.body img { margin:5px 0; padding:3px; background:#f8f8f8; border:1px solid #e9e9e9; float:left;}
.body img.floated { float:left; margin:0; border:none; padding:5px 0; background:none;}
.body img.serv { margin:10px; padding:0 0 30px 0; float:left;}
.right { width:450px; margin:0; padding:0 20px; float:left;}
.left ul { list-style:none; margin:10px 0; padding:0;}
.left li { color:#1d2024; font: normal 12px Arial, Helvetica, sans-serif; padding:5px 0 5px 15px; background:url(images/ul_li.gif) left no-repeat; margin:0; border-bottom:1px solid #e8e8e8;}
.left { width:450px; margin:0; padding:0 10px 0 20px; float:right;}
.leftvideo { width:980px; height:410px; margin:5; padding:0 5px 5 5px; float:right;}
.leftcontacto { width:320px; margin:0; padding:0 10px 0 20px; float:right;}
.last { padding:0 20px;}
.port { width:210px; margin:10px 0; padding:0; float:left;}
/********** contact form **********/
#contactform { margin:0; padding:5px 0; }
#contactform * { color:#F00; }
#contactform ol { margin:0; padding:0; list-style:none; }
#contactform li { margin:0; padding:0; background:none; border:none; display:block; clear:both; }
#contactform li.buttons { margin:5px 0 5px 0; clear:both; }
#contactform label { margin:0; width:400px; display:block; padding:5px 0; color:#5f5f5f; font: normal 12px Arial, Helvetica, sans-serif; float:left; }
#contactform label span { color:#d66423; font-weight:bold; }
#contactform input.text { width:450px; border:1px solid #e8e8e8; margin:2px 0; padding:5px 2px; height:16px; background:#f8f8f8; float:left; }
#contactform textarea { width:450px; border:1px solid #e8e8e8; margin:2px 0; padding:2px; background:#f8f8f8; float:left; }
#contactform li.buttons input { padding:3px 0 3px 0; margin:10px 0 0 0; border:0; color:#FFF; float:left; }

/*************footer**********/
.footer {margin:0 auto; padding:0 0 18px 0; width:980px; bottom center no-repeat; background:#3f3f3f url(images/footer_bg.gif);}
.footer_resize { width:980px; margin:0 auto; padding:0;}
.footer p { text-align:center; font:normal 13px Arial, Helvetica, sans-serif; color:#ffffff; padding:8px 0 0 0}
.footer a { font:bold 13px Arial, Helvetica, sans-serif; color:#ffffff; text-decoration:none; padding:8px 0 0 0 }
.footer p.right { text-align:right; width:400px; margin:0; padding:8px 0 0 0;}
.footer p.leftt { text-align:left; width:400px; margin:0; padding:8px 0 0 0;}
p.clr, .clr { clear:both; padding:0; margin:0; background:none;}
.bg { clear:both; padding:25px 0; margin:0; border-bottom:1px solid #d0d0d0;}
/* Slider */
#slider { width:980px; padding:10px 0 0 0; margin:0 auto;}
#slider h2 { font: bold italic 30px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#727272; padding:0 0 30px 0; margin:0;}
#slider .flash_slider { width:980px; height:300px; margin:0; overflow:hidden;}
#video .video_slider { width:980px; height:410px; margin:0; overflow:hidden;}
.slide_blog_bg { background:#2e2f2f; margin:0 auto; padding:0 0 8px 0; width:980px;}
.slide_blog_bg h3 { font: normal 30px "Trebuchet MS", Arial, Helvetica, sans-serif; padding:15px 0 8px 8px; margin:0; color:#fff;}
.slide_blog { width:980px; float:left; padding:5px 20px 5px 10px;}
.slide_blog.last { padding:5px 20px 5px 20px;}
.slide_blog img { float:left; margin:-15px 0 0 0; padding:0 10px 10px 0;}
.slide_blog h3 { font: bold 18px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#fff; padding:8px 0; margin:0 0 8px 0;}
.slide_blog h3 span { font: bold 13px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#a9a8a8; padding:0; margin:0;}
.slide_blog p { font: normal 12px Arial, Helvetica, sans-serif; color:#979797; padding:0; margin:0; line-height:1.8em;}


EL FUENTE DE HTML LO PODEIS SACAR DE LA WEB

MUXAS GRACIAS X TODA LA AYUDA K ME ESTAIS DANDO

[emprear]

illera:


No lo tomes a mal pero bastante desastrozo lo que estás haciendo.

Trabajé sobre la página del video solamente

trabajá como base con lo que sigue

Código HTML:

<!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>
<title>RH BODY ZEN</title>
<!-- base href="http://www.rhbodyzen.com/" / -->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/flash_detect.v1.7.js">
var so = new SWFObject('mediaplayer.swf','mpl','980','410','8');
so.addParam('allowscriptaccess','always');
so.addParam('allowfullscreen','true');
so.addVariable('height','410');
so.addVariable('width','980');
so.addVariable('file','videos/video.flv');
so.addVariable('screencolor','0x000000');
so.addParam('autostart','true');
so.write('player');
  </script>
 
</head>
<body>
<div class="main">
  <div class="header">
    <div class="logo"><a href="index.html"><img src="images/logo.png" width="228" height="116" border="0" alt="logo" /></a></div>
    <div class="menu">
      <ul>
        <li><a href="home.html"><span>Home</span></a></li>
 
    <li><a href="index.html"  class="active"><span>Conocenos</span></a></li>
        <li><a href="tratamientos.html"><span> Tratamientos</span></a></li>
        <li><a href="precios.html"><span> Precios</span></a></li>
        <li><a href="contact.html"><span> Contacto </span></a></li>
      </ul>
 
    </div>
  </div>
<div id="slider">
    <div class="video_slider">
 <embed align="center" 
src="mediaplayer.swf"
width="980"
height="410"
allowscriptaccess="always"
allowfullscreen="true"
flashvars="height=410&width=980&file=videos/video.flv&screencolor=0x000000&autostart=true"/></embed> 
</div>
    <div class="clr"></div>
    <img src="images/simple_bg.gif" alt="picture" width="980" height="22" />
    <div class="clr" style="padding:20px 0 0 0;"></div>
 
 </div>  </div>
</div>
</body>
</html>
 

Sigue teniendo varios errores, pero al menos se ve. No se bien que efecto final queres para el menú, pero descartá el cufón, si con el html te llevas mal, quizás peor sea con js. Probá con @fontface en todo caso

Y si vas a seguir con esto, por favor ponte a estudiar algo, si no la cosa se complica

http://librosweb.es

Demo
http://foros.emprear.com/html/rhbodyzen.html

Saludos

[illera]

Ya esta solucionado Muxas Gracias

[DarkAlexVe]

Hola disculpa, ya se que esta un poco viejo este Post pero tengo exactamente el mismo problema ahora mismo!! estoy desesperado ya que he intentado de todo y nada

Cuando visualizo la web por Firefox todo excelente, pero por IE 9 me pide el bendito Activex y se ocultan los botones del menu

Este es el fragmento de codigo del menu

<div class="nav-box">
<div class="left png">
<div class="right png">
<div class="tail png">
<ul>
<li><a href="#"><span>INICIO</span></a></li>
<li><a href="fotos.html">FOTOS</a></li>
<li><a href="cartas.html">CARTAS PARA SANTA </a></li>
<li><a href="contact-us.html">CUENTOS DE SANTA</a></li>
<li class="last"><a href="sitemap.html">CONTACTO</a></li>
</ul>
</div>
</div>
</div>
</div>

y CSS:

.nav-box ul li {font-size:16px;line-height:1.2em;text-transform:uppercase;background:url(images/divider1.gif) no-repeat right 2px;float:left;padding:20px 25px 15px 20px}

[emprear]

no hay nada que relacione a un control ActiveX con ese código que mostrás, debe de haber algo más interfiriendo en tu html, pasá la url de la página

Saludos

[DarkAlexVe]

El link de la web es:

http://www.navidadconsanta.com/nuevaweb/

[emprear]

Bueno, estuve revisando y te dejo algunas recomendaciones.

1. Usá el Doctype transicional, no el strict, asi te valida el iframe

Código HTML:

<!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" xml:lang="es" lang="es">
 

2. falta un cierre de un div al final, deberia quedarte asi, tambien le agregue el type al <script>, el languaje es obsoleto

Código HTML:

</div>
        </div>
    </div>
</div>
</div>
<script  type="text/javascript">
document.oncontextmenu = function(){return false;}
</script>
<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>
 

Por lo del menú, curiosamente, en IE8 y 7 se ve bien, y en IE9 no, el problema basicamente está en el uso de cufon(), que provoca una muy sutil incompatibilidad en alguna de tus scripts en IE9, de por sí, cufon() es problemático y en mi opinión... un adefesio, sobre todo teniendo la posibilidad de usar @fontface, te aconsejo que lo uses

http://www.fontsquirrel.com/
De ló unico que tenes que segurarte es que la fuente que selecciones, soporte los acentos y tildes, lo podés verificar en el test-drive,

un ejemplo
http://www.fontsquirrel.com/fonts/Roman-Caps

en el menu arriba hace el test-drive y escribí caracters latinos, ñ, á , etc, si los soporta (como en esta fuente, ok), cuando lo hayas verificado para la fuente que elijas, no bajes la fuente sino el @font-face Kit
es un zip que baja la fuente y una página de prueba más todo el código css para poder implementarlo.


Saludos

[DarkAlexVe]

Hola emprear, muchisimas gracias, efectivamente es el Cufon el que estaba dando problemas... intente hacer lo que comentates peeero me complique mucho y termine actualizando el Cufon a la ultima version y problemas resueltos!

De verdad muchisimas gracias por tu ayuda, de no ser por eso no me habria dado cuenta!