Foros del Web » Creando para Internet » HTML »

socorro: Código para resolución

Estas en el tema de socorro: Código para resolución en el foro de HTML en Foros del Web. Estoy haciendo mi web con capas para resolucion de 800x600. El problema es que no se que código insertar para que aparezca en el navegador ...
  #1 (permalink)  
Antiguo 20/06/2008, 04:32
 
Fecha de Ingreso: abril-2007
Mensajes: 119
Antigüedad: 10 años, 8 meses
Puntos: 1
socorro: Código para resolución

Estoy haciendo mi web con capas para resolucion de 800x600. El problema es que no se que código insertar para que aparezca en el navegador rodeada del espacio blanco.

Tengo problemas también para centrar la web, pongo el body con el align center y nada. Socorro
  #2 (permalink)  
Antiguo 20/06/2008, 09:36
 
Fecha de Ingreso: diciembre-2005
Mensajes: 97
Antigüedad: 12 años
Puntos: 0
Respuesta: socorro: Código para resolución

Hola currante007, voy a su poner que estas maquetando con css, por lo tanto empieza por poner esto en el css.
Código:
*{margin:0; padding:0}
#contenedor{width:800px; height:600px; margin:10px auto; background-color:#aaccdd}
en el html
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="en" lang="en">
	<head>
		<title>centrado web</title>
		<link rel="stylesheet" type="text/css" href="estilo.css" />
	</head>
	<body>
		<div id="contenedor">
			<p> este div esta centrado y es donde tendria q ir el contenido de tu web</p>
		</div>  
	</body>
</html> 
__________________
_Derek_
  #3 (permalink)  
Antiguo 20/06/2008, 09:53
Avatar de gildus  
Fecha de Ingreso: agosto-2003
Mensajes: 1.495
Antigüedad: 14 años, 4 meses
Puntos: 105
Respuesta: socorro: Código para resolución

Holas,

Con lo que te envio pavelinhos deberia de funcionarte, serie bueno que postees tu codigo HTML para ver donde esta tu error.

Saludos
Gildus
__________________
.: Gildus :.
  #4 (permalink)  
Antiguo 20/06/2008, 16:56
 
Fecha de Ingreso: abril-2007
Mensajes: 119
Antigüedad: 10 años, 8 meses
Puntos: 1
Respuesta: socorro: Código para resolución

Vereis, seguramente os encontrareis con bastante caos, ya que no se apenas hacer webs. No se me centra el contenido, y creo que lo he puesto dentro del div contenedor. Mirad el código a ver si lo averiguais. Gracias


Cita:
<!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=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
left:8px;
top:15px;
width:2px;
height:0px;
z-index:1;
}
#Layer2 {
position:absolute;
left:286px;
top:34px;
width:532px;
height:102px;
z-index:1;
background-color: #CCCCFF;
clip: rect(auto,auto,auto,-5);
font-size: 24px;
line-height: 30px;
border: thick doble #CCCCCC;
background-image: url(imagenes/texturas/beis.jpg);
}
-->
</style>
<link href="estilo.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
#Layer3 {
position:absolute;
left:122px;
top:159px;
width:143px;
height:298px;
z-index:2;
clip: rect(auto,auto,auto,-30);
text-decoration: blink;
border: thick doble #CCCCCC;
}
#Layer4 {
position:absolute;
left:164px;
top:126px;
width:530px;
height:263px;
z-index:3;
}
#Layer5 {
position:absolute;
left:5px;
top:15px;
width:5px;
height:1px;
z-index:4;
}
#Layer6 {
position:absolute;
left:123px;
top:35px;
width:136px;
height:72px;
z-index:4;
border: thick doble #999999;
}
.Estilo2 {font-size: 14px}
.Estilo3 {font-size: 14}
#Layer7 {
position:absolute;
left:163px;
top:16px;
width:536px;
height:108px;
z-index:5;
}
.Estilo4 {color: #FFFFFF}
.Estilo5 {font-size: 14; color: #FFFFFF; }
.Estilo6 {font-size: 14px; color: #FFFFFF; }
#variable {
position:absolute;
left:283px;
top:159px;
width:523px;
height:287px;
z-index:5;
border: thick doble #CCCCCC;
background-image: url(imagenes/texturas/gris%20cuadros.jpg);
overflow: auto;
}
-->
</style>
</head>

<body>
<div id="contenedor">
<div id="Layer3">
<div class="menu" id="menu">
<p>&nbsp;</p>
<p align="center"><span class="Estilo2"><span class="Estilo3"><span class="Estilo4"><a href="donde estamos">B&uacute;scanos en </a></span></span></span></p>
<p align="center" class="Estilo4"><span class="Estilo2"><span class="Estilo3"><a href="donde estamos">el mapa </a></span></span></p>
<p align="center" class="Estilo5">-------------------------</p>
<p align="center" class="Estilo5"><span class="Estilo2"><a href="productos">Productos</a></span></p>
<p align="center" class="Estilo6">-------------------------</p>
<p align="center"><a href="Contacta con nosotros">Contacta con </a></p>
<p align="center"><a href="Contacta con nosotros">nosotros</a></p>
<p align="center" class="Estilo6">--------------------------</p>
<p align="center">Fotos</p>
<p align="center" class="Estilo4 Estilo2">--------------------------</p>
<p align="center" class="Estilo4 Estilo2">horario</p>
<p align="center" class="Estilo4 Estilo2">---------------------------</p>
</div>
</div>
<div id="Layer6">
<div><img src="imagenes/casfer.JPG" width="144" height="104" /></div>
</div>
<div id="Layer2">
<p>&nbsp;</p>
<p align="center">Fundado en 1994 en Castell&oacute;n de la Plana </p>
</div>
<div id="variable">
<p>&nbsp;</p>
<p align="justify"><img src="imagenes/DSCF1102.JPG" width="189" height="227" align="left" /> Casfer es un comercio que desde 1993 se dedica al negocio de la ferreter&iacute;a, con todo tipo de art&iacute;culos a su disposici&oacute;n. </p>
<p align="justify">Adem&aacute;s, si usted es de alg&uacute;n pueblo de la prov&iacute;ncia de Castell&oacute;n, le llevamos un pedido de material donde ud. desee.</p>
</div>
</div>
</div>
</body>
</html>
  #5 (permalink)  
Antiguo 21/06/2008, 02:13
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Respuesta: socorro: Código para resolución

Te faltó el CSS (ponlo después de <style type="text/css"><!--). Son estas líneas:
Código:
*{margin:0; padding:0}
#contenedor{width:800px; height:600px; margin:10px auto; background-color:#aaccdd}
La primera línea no hace falta que la pongas, pero sirve para eliminar los márgenes (y no sé la traducción de padding ).
  #6 (permalink)  
Antiguo 22/06/2008, 17:01
 
Fecha de Ingreso: abril-2007
Mensajes: 119
Antigüedad: 10 años, 8 meses
Puntos: 1
Respuesta: socorro: Código para resolución

lo he puesto y sige sin funcionarme. Gracias por las respuestas

Cita:
<!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=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
<!--
*{margin:0; padding:0}
#contenedor{width:800px; height:600px; margin:10px auto; background-color:#aaccdd}
#Layer1 {
position:absolute;
left:8px;
top:15px;
width:2px;
height:0px;
z-index:1;
}
#Layer2 {
position:absolute;
left:286px;
top:34px;
width:532px;
height:102px;
z-index:1;
background-color: #CCCCFF;
clip: rect(auto,auto,auto,-5);
font-size: 24px;
line-height: 30px;
border: thick doble #CCCCCC;
background-image: url(imagenes/texturas/beis.jpg);
}
-->
</style>
<link href="estilo.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
#Layer3 {
position:absolute;
left:122px;
top:159px;
width:143px;
height:298px;
z-index:2;
clip: rect(auto,auto,auto,-30);
text-decoration: blink;
border: thick doble #CCCCCC;
}
#Layer4 {
position:absolute;
left:164px;
top:126px;
width:530px;
height:263px;
z-index:3;
}
#Layer5 {
position:absolute;
left:5px;
top:15px;
width:5px;
height:1px;
z-index:4;
}
#Layer6 {
position:absolute;
left:123px;
top:35px;
width:136px;
height:72px;
z-index:4;
border: thick doble #999999;
}
.Estilo2 {font-size: 14px}
.Estilo3 {font-size: 14}
#Layer7 {
position:absolute;
left:163px;
top:16px;
width:536px;
height:108px;
z-index:5;
}
.Estilo4 {color: #FFFFFF}
.Estilo5 {font-size: 14; color: #FFFFFF; }
.Estilo6 {font-size: 14px; color: #FFFFFF; }
#variable {
position:absolute;
left:283px;
top:159px;
width:523px;
height:287px;
z-index:5;
border: thick doble #CCCCCC;
background-image: url(imagenes/texturas/gris%20cuadros.jpg);
overflow: auto;
}
-->
</style>
</head>

<body>
<div id="contenedor">
<div id="Layer3">
<div class="menu" id="menu">
<p>&nbsp;</p>
<p align="center"><span class="Estilo2"><span class="Estilo3"><span class="Estilo4"><a href="donde estamos">B&uacute;scanos en </a></span></span></span></p>
<p align="center" class="Estilo4"><span class="Estilo2"><span class="Estilo3"><a href="donde estamos">el mapa </a></span></span></p>
<p align="center" class="Estilo5">-------------------------</p>
<p align="center" class="Estilo5"><span class="Estilo2"><a href="productos">Productos</a></span></p>
<p align="center" class="Estilo6">-------------------------</p>
<p align="center"><a href="Contacta con nosotros">Contacta con </a></p>
<p align="center"><a href="Contacta con nosotros">nosotros</a></p>
<p align="center" class="Estilo6">--------------------------</p>
<p align="center">Fotos</p>
<p align="center" class="Estilo4 Estilo2">--------------------------</p>
<p align="center" class="Estilo4 Estilo2">horario</p>
<p align="center" class="Estilo4 Estilo2">---------------------------</p>
</div>
</div>
<div id="Layer6">
<div><img src="imagenes/casfer.JPG" width="144" height="104" /></div>
</div>
<div id="Layer2">
<p>&nbsp;</p>
<p align="center">Fundado en 1994 en Castell&oacute;n de la Plana </p>
</div>
<div id="variable">
<p>&nbsp;</p>
<p align="justify"><img src="imagenes/DSCF1102.JPG" width="189" height="227" align="left" /> Casfer es un comercio que desde 1993 se dedica al negocio de la ferreter&iacute;a, con todo tipo de art&iacute;culos a su disposici&oacute;n. </p>
<p align="justify">Adem&aacute;s, si usted es de alg&uacute;n pueblo de la prov&iacute;ncia de Castell&oacute;n, le llevamos un pedido de material donde ud. desee.</p>
</div>
</div>
</div>
</body>
</html>
  #7 (permalink)  
Antiguo 22/06/2008, 17:46
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: socorro: Código para resolución

¿Qué es lo que no te funciona? Con este código yo veo un contenedor de 800px centrado en la pantalla. A no ser que lo que tengas en la hoja externa "estilo.css" impida que lo haga.
Le he limpiado un par de cositas:

Cita:
<!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=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<link href="estilo.css" rel="stylesheet" type="text/css" />
<style type="text/css">
*{margin:0; padding:0}
#contenedor{width:800px; height:600px; margin:10px auto; background-color:#aaccdd}
#Layer1 {
position:absolute;
left:8px;
top:15px;
width:2px;
height:0px;
z-index:1;
}
#Layer2 {
position:absolute;
left:286px;
top:34px;
width:532px;
height:102px;
z-index:1;
background-color: #CCCCFF;
clip: rect(auto,auto,auto,-5);
font-size: 24px;
line-height: 30px;
border: thick doble #CCCCCC;
background-image: url(imagenes/texturas/beis.jpg);
}
#Layer3 {
position:absolute;
left:122px;
top:159px;
width:143px;
height:298px;
z-index:2;
clip: rect(auto,auto,auto,-30);
text-decoration: blink;
border: thick doble #CCCCCC;
}
#Layer4 {
position:absolute;
left:164px;
top:126px;
width:530px;
height:263px;
z-index:3;
}
#Layer5 {
position:absolute;
left:5px;
top:15px;
width:5px;
height:1px;
z-index:4;
}
#Layer6 {
position:absolute;
left:123px;
top:35px;
width:136px;
height:72px;
z-index:4;
border: thick doble #999999;
}
.Estilo2 {font-size: 14px}
.Estilo3 {font-size: 14}
#Layer7 {
position:absolute;
left:163px;
top:16px;
width:536px;
height:108px;
z-index:5;
}
.Estilo4 {color: #FFFFFF}
.Estilo5 {font-size: 14; color: #FFFFFF; }
.Estilo6 {font-size: 14px; color: #FFFFFF; }
#variable {
position:absolute;
left:283px;
top:159px;
width:523px;
height:287px;
z-index:5;
border: thick doble #CCCCCC;
background-image: url(imagenes/texturas/gris%20cuadros.jpg);
overflow: auto;
}
</style>
</head>
<body>
<div id="contenedor">
<div id="Layer3">
<div class="menu" id="menu">
<p>&nbsp;</p>
<p align="center"><span class="Estilo2"><span class="Estilo3"><span class="Estilo4"><a href="donde estamos">B&uacute;scanos en </a></span></span></span></p>
<p align="center" class="Estilo4"><span class="Estilo2"><span class="Estilo3"><a href="donde estamos">el mapa </a></span></span></p>
<p align="center" class="Estilo5">-------------------------</p>
<p align="center" class="Estilo5"><span class="Estilo2"><a href="productos">Productos</a></span></p>
<p align="center" class="Estilo6">-------------------------</p>
<p align="center"><a href="Contacta con nosotros">Contacta con </a></p>
<p align="center"><a href="Contacta con nosotros">nosotros</a></p>
<p align="center" class="Estilo6">--------------------------</p>
<p align="center">Fotos</p>
<p align="center" class="Estilo4 Estilo2">--------------------------</p>
<p align="center" class="Estilo4 Estilo2">horario</p>
<p align="center" class="Estilo4 Estilo2">---------------------------</p>
</div>
</div>
<div id="Layer6">
<div><img src="imagenes/casfer.JPG" width="144" height="104" /></div>
</div>
<div id="Layer2">
<p>&nbsp;</p>
<p align="center">Fundado en 1994 en Castell&oacute;n de la Plana </p>
</div>
<div id="variable">
<p>&nbsp;</p>
<p align="justify"><img src="imagenes/DSCF1102.JPG" width="189" height="227" align="left" /> Casfer es un comercio que desde 1993 se dedica al negocio de la ferreter&iacute;a, con todo tipo de art&iacute;culos a su disposici&oacute;n. </p>
<p align="justify">Adem&aacute;s, si usted es de alg&uacute;n pueblo de la prov&iacute;ncia de Castell&oacute;n, le llevamos un pedido de material donde ud. desee.</p>
</div>
</div>
</body>
</html>
Mikel.
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 02:49.