Foros del Web » Creando para Internet » Diseño web »

Problema con <!DOCTYPE

Estas en el tema de Problema con <!DOCTYPE en el foro de Diseño web en Foros del Web. Buenas, espero q me respondan, y que puedan ayudarme, y si así es, desde ya muchas gracias. Resulta q estoy haciendo un sitio web, y ...
  #1 (permalink)  
Antiguo 07/11/2010, 21:44
 
Fecha de Ingreso: noviembre-2010
Ubicación: Córdoba, Argentina
Mensajes: 74
Antigüedad: 7 años, 1 mes
Puntos: 4
Problema con <!DOCTYPE

Buenas, espero q me respondan, y que puedan ayudarme, y si así es, desde ya muchas gracias.
Resulta q estoy haciendo un sitio web, y dentro de este tengo un menú con un estilo declarado para que cumpla la función de desplegable, osea cuando el puntero de mouse esta sobre el menú, este desplega opciones hacia abajo, el hecho es q este estilo necesita de la linea de declaración de esta de la que se habla aquí (<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">).
El problema es que al ponerla, toda la pagina queda desplazada una linea abajo, y eso me desordena todo. Y si no la pongo el menú no se desplega.
Hay algo q pueda hacer?
  #2 (permalink)  
Antiguo 07/11/2010, 22:13
Avatar de ElJavista
Colaborador
 
Fecha de Ingreso: marzo-2007
Ubicación: Lima Perú
Mensajes: 2.231
Antigüedad: 10 años, 9 meses
Puntos: 67
Respuesta: Problema con <!DOCTYPE

Si, hay algo, sólo pon ese susodicho doctype e intenta arreglar el desplazamiento de la página. Para eso talvez solo tengas que reducir el margin del body o talvez algo con el DIV que envuelve toda la página. Pon tu código para ver que pasa.
  #3 (permalink)  
Antiguo 08/11/2010, 07:22
 
Fecha de Ingreso: noviembre-2010
Ubicación: Córdoba, Argentina
Mensajes: 74
Antigüedad: 7 años, 1 mes
Puntos: 4
Respuesta: Problema con <!DOCTYPE

Gracias, si ahora pongo el codigo.
Lo que se desplaza es el contenido de un iframe, ese iframe recarga varias paginas dentro, y las q no tienen la linea del DOCTYPE estan encuadradas bien pero esta q lo tiene queda desplazada una linea abajo.

Este es el sitio contenedor:

Código:
<html>
<head>
<title></title>
<link href="../style.css" rel="stylesheet" type="text/css" />

</head>

<body oncontextmenu="return false;">
	<div id="warp">
	<div id="contenedor">
			<div class="cont1">
				<div class="menu">
					<div align="left"><a href="opt/falt.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/falt.png" alt="Fragancias Alternativas" border="0"></a></div>
					<div align="left"><a href="opt/fexc.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/fexc.png" alt="Fragancias Exclusivas" border="0"></a></div>
					<div align="left"><a href="opt/lmt.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lineyoume.png" alt="Tu Reflejo - Mi Reflejo" border="0"></a></div>
					<div align="left"><a href="opt/lblack.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lblack.png" alt="Linea Black" border="0"></a></div>
					<div align="left"><a href="opt/lsweetc.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lsweetc.png" alt="Linea Sweet Carolina" border="0"></a></div>
					<div align="left"><a href="opt/lmakeup.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lmakeup.png" alt="Linea Make Up" border="0"></a></div>
					<div align="left"><a href="opt/lcye.html" target="window2"><img src="http://www.forosdelweb.com/f91/img/lcye.png" alt="Linea Cremas y Emulsiones" border="0"></a></div>
					<div align="left"><a href="opt/lgolda.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lgolda.png" alt="Linea Gold Attraction" border="0"></a></div>
					<div align="left"><a href="opt/lcorp.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lcorp.png" alt="Linea Corporal" border="0"></a></div>
					<div align="left"><a href="opt/lregala.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lregala.png" alt="Linea Regalables" border="0"></a></div>
					<div align="left"><a href="opt/linfant.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/linfant.png" alt="Linea Infantil" border="0"></a></div>
					<div align="left"><a href="opt/lcapilar.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lcapilar.png" alt="Linea Capilar" border="0"></a></div>
					<div align="left"><a href="opt/lmfeet.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lmfeet.png" alt="Linea Millanel Feet" border="0"></a></div>
					<div align="left"><a href="opt/lmsun.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lmsun.png" alt="Linea Millanel Sun" border="0"></a></div>
					<div align="left"><a href="opt/lambiental.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lambiental.png" alt="Linea Ambienteal" border="0"></a></div>
					<div align="left"><a href="opt/laroma.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/laroma.png" alt="Linea Aromaterapia" border="0"></a></div>
					<div align="left"><a href="opt/lmyhome.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/lmyhome.png" alt="Linea Mi Hogar" border="0"></a></div>
					<div align="left"><a href="opt/ljoyasc.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/ljoyasc.png" alt="Linea Joyas Collection" border="0"></a></div>
					<div align="left"><a href="opt/accesorios.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/accesorios.png" alt="Accesorios" border="0"></a></div>
					<div align="left"><a href="opt/libros.htm" target="window2"><img src="http://www.forosdelweb.com/f91/img/libros.png" alt="Libros" border="0"></a></div>
				</div>
			</div>
			<div class="sep"><img src="http://www.forosdelweb.com/f91/img/separador.png"></div>
			<div class="cont2">
				<iframe name="window2" src="ini.htm" width="800" height="800" marginwidth="0"  frameborder="0" scrolling="no"></iframe>
			</div>
</div>
</body>
</html>
Y este el contenido del iframe:

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link href="../../style.css" rel="stylesheet" type="text/css" />
<!-- estilo menu sup -->
<style type="text/css">

.preload2 {background: url();}
.menu2 {padding:0; margin:0; margin-bottom:0; list-style:none; height:25px; position:relative; font-family: "Times New Roman", Times, serif; }
.menu2 li.top {display:block; float:left; position:relative;}
.menu2 li a.top_link {display:block; float:left; height:25px; margin-left:6px; line-height:25px; color:#000; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 6px; cursor:pointer;}
.menu2 li a.top_link span {float:left; display:block; padding:0 10px 0 6px; height:40px;}
.menu2 li a.top_link span.down {float:left; display:block; padding:0 10px 0 6px; height:25px;/*background:url(prodrop2/down.gif) no-repeat right top;*/}
.menu2 li a.top_link:hover {color:#fff;  background:#000;}
.menu2 li a.top_link:hover span { background:#000}
.menu2 li a.top_link:hover span.down { background:#000}

.menu2 li:hover > a.top_link {color:#fff; background:#000;}
.menu2 li:hover > a.top_link span {background:#000;}
.menu2 li:hover > a.top_link span.down {background:#000;}


.menu2 table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;}

/* Default link styling */

/* Style the list OR link hover. Depends on which browser is used */

.menu2 a:hover {visibility:visible;}
.menu2 li:hover {position:relative; z-index:200;}

/* keep the 'next' level invisible by placing it off screen. */
.menu2 ul, 
.menu2 :hover ul ul, 
.menu2 :hover ul :hover ul ul,
.menu2 :hover ul :hover ul :hover ul ul,
.menu2 :hover ul :hover ul :hover ul :hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

.menu2 :hover ul.sub {left:6px; top:25px; background: #0B0B0B; padding:0; /*border:1px solid #1E8BB5; white-space:nowrap;*/ width:auto; height:auto; font-weight:normal;}
.menu2 :hover ul.sub li {display:block; /*height:20px; */position:relative; float:left; width:140px; border-bottom:1px solid #005FB9; border-left:2px solid #005FB9; border-right:1px solid #005FB9; margin-bottom:0; clear: both}
.menu2 :hover ul.sub li a {display:block; height:auto; font-size:11px; padding:4px 3px; line-height:1; color:#005FB9; text-decoration:none;}
.menu2 :hover ul.sub li a.fly {background: #0B0B0B no-repeat 150px 6px;}
.menu2 :hover ul.sub li a:hover {background: url(); color:#005FB9;}
.menu2 :hover ul.sub li a.fly:hover {background: url() no-repeat 150px 6px;}
.menu2 :hover ul li:hover > a.fly {background: url()} 

.menu2 :hover ul :hover ul,
.menu2 :hover ul :hover ul :hover ul,
.menu2 :hover ul :hover ul :hover ul :hover ul,
.menu2 :hover ul :hover ul :hover ul :hover ul :hover ul
{left:160px; top:-1px; background: url(); padding:0; /* white-space:nowrap; */width:auto; z-index:300; height:auto;}
.menu2 :hover ul.sub li ul {border-top:1px solid #005FB9; background: #1C1C1C; z-index:300;}

</style>
<!-- fin estilo menu sup -->
</head>
<body oncontextmenu="return false;">
	<div id="warp">
		<div id="contenedor2">
			<div class="cont3">
				<table width="795px"  border="0" align="center">
  					<tr>
    					<td align="center"><ul class="menu2">
<!-- -->
<li class="top"><a class="top_link" href="#"><span class="down">EAU de PARFUM</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
		<!--[if lte IE 6]><table><tr><td><![endif]-->
		<ul class="sub">			
			<li><a href="#">Menu 1</a></li>
			<li><a href="#">Menu 2</a></li>
			<li><a href="#">Menu 3</a></li>
			<li><a href="#">Menu 4</a></li>
		</ul>
		<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!-- -->
				</ul>
						</td>
					</tr>
				</table>
			</div>	
			<div class="cont2">
				<iframe name="window3" src="../../img/ini.gif" width="780" height="800" marginwidth="0"  frameborder="0" scrolling="no"></iframe>
			</div>
</div>
</body>
</html>
este ultimo es el q se desplaza si tiene la linea, y si no esta queda bien.
Los bordes de los divs, si es que los ven, solo son temporales para organizar hasta que termine y despues voy a sacarlos.

Última edición por elmouse19; 08/11/2010 a las 07:33
  #4 (permalink)  
Antiguo 09/11/2010, 12:11
 
Fecha de Ingreso: noviembre-2010
Ubicación: Córdoba, Argentina
Mensajes: 74
Antigüedad: 7 años, 1 mes
Puntos: 4
Respuesta: Problema con <!DOCTYPE

alguien sabe algo?
  #5 (permalink)  
Antiguo 11/11/2010, 09:48
 
Fecha de Ingreso: noviembre-2010
Ubicación: Córdoba, Argentina
Mensajes: 74
Antigüedad: 7 años, 1 mes
Puntos: 4
Respuesta: Problema con <!DOCTYPE

Cita:
Iniciado por ElJavista Ver Mensaje
Si, hay algo, sólo pon ese susodicho doctype e intenta arreglar el desplazamiento de la página. Para eso talvez solo tengas que reducir el margin del body o talvez algo con el DIV que envuelve toda la página. Pon tu código para ver que pasa.
Bueno muchisimas gracias, por la ayuda. Te cuento lo pude solucionar, en la pagina q contiene el iframe, osea la primera pagina, cambie en el codigo del iframe, el el marginheight, y le puse 0, con eso quedo bien.

el codigo corregido quedo asi:

Código:
<iframe name="window2" src="ini.htm" width="800" height="800" marginwidth="0"  frameborder="0" scrolling="no" marginheight="0"></iframe>
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 12:39.