[url=http://idclogic.com/proyectos/ucatel][/url]
Fijense en el menu lateral en la parte superior
en Firefox y demas todo ok
en ie 7 e ie6 me sale un espacio en la parte superior del menu
les agradeceria me apoyen muchas gracias
el html es:
Código :
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Grupo Ucatel</title> <link href="css/estilos.css" rel="stylesheet" type="text/css" /> <!--[if IE 5]> <style type="text/css"> /* coloque las reparaciones del modelo de cuadro para IE 5* en este comentario condicional */ .twoColFixLtHdr #sidebar1 { width: 230px; } </style> <![endif]--><!--[if IE]> <style type="text/css"> /* coloque las reparaciones de css para todas las versiones de IE en este comentario condicional */ .twoColFixLtHdr #sidebar1 { padding-top: 30px; } .twoColFixLtHdr #mainContent { zoom: 1; } /* la propiedad zoom propia que se indica más arriba proporciona a IE el hasLayout que necesita para evitar diversos errores */ </style> <![endif]--> </head> <body class="twoColFixLtHdr"> <div id="container"> <div id="header"> <!-- end #header --> </div> <div id="banner_top"> <img src="imagenes/banner_top.jpg" alt="" /> </div><div id="sidebar1"> <div class="logo_ugarte"></div> <div class="menuizq1"> <a href="index.#" class="menuizq3">Empresa</a> <a href="index.#" class="menuizq3">Servicios</a> <a href="index.#" class="menuizq3">Tarifas</a> <a href="index.#" class="menuizq3">Clientes</a> <a href="index.#" class="menuizq3">Contáctenos</a> <a href="index.#" class="menuizq3">Preguntas Frecuentes</a> <a href="index.#" class="menuizq3">Cotización</a> <a href="index.#" class="menuizq3">Bolsa de trabajo</a> </div> <div class="logo_telegestion"></div> <div class="menuizq1"> <a href="index.#" class="menuizq3">Empresa</a> <a href="index.#" class="menuizq3">Servicios</a> <a href="index.#" class="menuizq3">Tarifas</a> <a href="index.#" class="menuizq3">Clientes</a> <a href="index.#" class="menuizq3">Contáctenos</a> <a href="index.#" class="menuizq3">Preguntas Frecuentes</a> <a href="index.#" class="menuizq3">Cotización</a> <a href="index.#" class="menuizq3">Bolsa de trabajo</a> </div> <!-- end #sidebar1 --> </div> <div id="mainContent"> <div class="textobienvenida">Bienvenido a Grupo UCATEL, organización dedicada a las Recuperaciones Judiciales y Servicios de Telemarketing, conformada por dos unidades de negocio: UGARTE CONSULTORES ASOCIADOS y TELEGESTION EMPRESARIAL</div> <div class="abajo50"><img src="imagenes/banner_ugarte.jpg" width="641" height="90"/><br /> <strong>Déjelo en nuestras manos</strong>… En <strong>Ugarte Consultores Asociados</strong> nos hacemos cargo de sus casos de <strong>Recuperación de Carteras Morosas</strong> con la más absoluta reserva y confianza que nuestros muchos años de experiencia en el mercado garantizan. </div> <!-- end #mainContent --> <br /> <div class="abajo50"><img src="imagenes/banner_telegestion.jpg" width="641" height="90" /><br /> Necesita ¿Incrementar sus ventas?, ¿Reforzar sus estrategias comerciales?, o ¿Mantener contacto frecuente con sus clientes?, <strong>Telegestión Empresarial</strong> es su mejor opción!. Obtenga resultados efectivos e inmediatos y… </div> <div class="formato1">CREZCA CON NOSOTROS</div> </div> <!-- Este elemento de eliminación siempre debe ir inmediatamente después del div #mainContent para forzar al div #container a que contenga todos los elementos flotantes hijos --> <br class="clearfloat" /> <div id="footer"> © Copyright 2009 <strong>Grupo UCATEL </strong> <div class="footer_menu"><strong><a href="#">HOME</a> | <a href="#">MAPA DEL SITIO</a> | <a href="#">ENLACES</a></strong></div> <br /> <br /> Av. Santa Catalina 598 – Esq. Pascual Saco Oliveros 789, Urb. Santa Catalina – L.13. La Victoria<br /> Teléfono: 700-6202 E-mail: [email protected]<br /> <br /> Ugarte Consultores Asociados. Teléfono: 700-6300 E-mail: [email protected] <div class="footer_menu">Desarrollado por <a href="#">IDCLogic</a></div> <br /> Telegestión Empresarial. Teléfono: 700-6205 E-mail: [email protected] <!-- end #footer --></div> <!-- end #container --></div> </body> </html>
y el css es:
Código :
@charset "utf-8"; html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } * { margin:0; padding:0; outline:0; list-style:none; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } /* remember to define focus styles! */ :focus { outline: 0; } /* remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0; } body { font: 100% Verdana, Arial, Helvetica, sans-serif; background: #666666; margin: 0; /* es recomendable ajustar a cero el margen y el relleno del elemento body para lograr la compatibilidad con la configuración predeterminada de los diversos navegadores */ padding: 0; text-align: center; /* esto centra el contenedor en los navegadores IE 5*. El texto se ajusta posteriormente con el valor predeterminado de alineación a la izquierda en el selector #container */ color: #000000; } body { background-image: url(../imagenes/bg.jpg); background-repeat: repeat-x; background-position: left top; background-color: #8f8f8f; margin-bottom: 30px; } .twoColFixLtHdr #container { width: 936px; /* el uso de 20px menos que un ancho completo de 800px da cabida a los bordes del navegador y evita la aparición de una barra de desplazamiento horizontal */ background: #FFFFFF; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */ border: 5px solid #FFFFFF; text-align: left; /* esto anula text-align: center en el elemento body. */ margin-top: 10px; margin-right: auto; margin-left: auto; } .twoColFixLtHdr #header { height: 100px; padding-top: 0; padding-right: 10px; padding-bottom: 0; padding-left: 20px; background-color: #D4D4D4; background-image: url(../imagenes/logo.jpg); background-position: right center; background-repeat: no-repeat; border-bottom-width: 5px; border-bottom-style: solid; border-bottom-color: #FFFFFF; } .twoColFixLtHdr #banner_top { background-color: #D4D4D4; background-image: url(../imagenes/logo.jpg); background-position: right center; background-repeat: no-repeat; border-bottom-width: 5px; border-bottom-style: solid; border-bottom-color: #FFFFFF; height: 143px; } .twoColFixLtHdr #header h1 { } .twoColFixLtHdr #sidebar1 { float: left; /* dado que este elemento es flotante, debe asignarse un ancho */ width: 242px; /* el ancho real de este div, en navegadores que cumplen los estándares, o el modo de estándares de Internet Explorer, incluirá el relleno y el borde además del ancho */ background: #ef181f; padding-top: 0px; padding-right: 0px; padding-bottom: 10px; padding-left: 0px; } .logo_ugarte { background-image: url(../imagenes/ugarte_logo.jpg); background-repeat: no-repeat; height: 66px; width: 242px; margin-bottom: 15px; border-bottom-width: 5px; border-bottom-style: solid; border-bottom-color: #FFFFFF; } #cols { } .logo_telegestion { background-image: url(../imagenes/telegestion_logo.jpg); background-repeat: no-repeat; height: 86px; width: 242px; margin-bottom: 15px; border-top-width: 5px; border-top-style: solid; border-top-color: #FFFFFF; border-bottom-width: 5px; border-bottom-style: solid; border-bottom-color: #FFFFFF; } .twoColFixLtHdr #mainContent { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #000000; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 250px; padding-left: 20px; line-height: 25px; padding-right: 20px; } .twoColFixLtHdr #footer { background-color: #DDDDDD; background-image: url(../imagenes/boceto04_40.jpg); background-repeat: repeat-x; height: 100px; padding-top: 5px; padding-right: 10px; padding-bottom: 0; padding-left: 20px; border-top-width: 5px; border-top-style: solid; border-top-color: #FFFFFF; font-size: 10px; color: #FFFFFF; } .twoColFixLtHdr #footer a{ color: #FFFFFF; text-decoration: none; } #footer .menu { float: right; } .fltrt { /* esta clase puede utilizarse para que un elemento flote en la parte derecha de la página. El elemento flotante debe preceder al elemento junto al que debe aparecer en la página. */ float: right; margin-left: 8px; } .fltlft { /* esta clase puede utilizarse para que un elemento flote en la parte izquierda de la página. */ float: left; margin-right: 8px; } .clearfloat { /* esta clase debe colocarse en un elemento div o break y debe ser el último elemento antes del cierre de un contenedor que incluya completamente a un elemento flotante */ clear:left; } .textobienvenida { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-style: italic; font-weight: bold; color: #5d5d5d; line-height: 25px; padding-top: 15px; margin-bottom: 50px; } .formato1 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-style: italic; font-weight: bold; color: #5d5d5d; padding-right: 20px; text-align: right; } .menuizq1 { background-color: #ef181f; margin-bottom: 10px; clear: right; width: 242px; } a.menuizq3{ display: block; font-weight: bold; color: #FFFFFF; text-decoration: none; line-height: 30px; font-size: 12px; padding-left: 20px; font-family: Arial, Helvetica, sans-serif; padding-top: 0px; padding-bottom: 0px; font-style: italic; background-color: #EF181F; background-image: url(../imagenes/li_on.gif); background-repeat: no-repeat; background-position: 0px 5px; } a.menuizq3:hover{ background-image: url(../imagenes/li_off.gif); background-repeat: no-repeat; background-color: #d40506; } .abajo50 { margin-bottom: 50px; } .idclogic { float: right; } .footer_menu { float: right; }