siempre es por un pixel

artelomano · #1 (**permalink**) 12/03/2009, 15:15

Hola amigos os comento, nose porque siempre hay un pixel coñazo,

Asin se me mueve segun el navegador:
En firefox (derecha),
En safari y opera (izquierda)
Y como no en el kiebracabezas del explorer se ve bien!! el centro

bueno como he resumido en cada navegador se me descuadra de una forma distinta y no tengo ni idea de que es , Haber si alguien tiene una solucion para todos que seguro q es muy util para el futuro.

UN POKO DE CODIGO(COMO VEIS ESTA ACABADA DE EMPEZAR LA WEB(DE HOY) pero me gustaria tener esto resuelto antes de continuar con la web):
ACLARACION:fondo.jpg es una imagen q alavez de ser el fondo hace un recuadro de 750 px en el medio y la cabecera tambien es de 750px y los pixeles que bailan

son sol de los bordes de ambas imagenes q deberia de coincidir.

Código HTML:

<body>
<div id="contenedorprincipal">
<div id="cabecera"><img src="imagenes/cabecera.jpg" alt="cabecera" /></div>
<div id="cuerpo">AKI IRA TODO AUN FALTA EL PIE PERO POKO A POKO JIJI</div>
</div>
</body>

Código:

*,body {
	margin: 0;
	padding: 0;
}
body {
	font: normal 12px Arial, Tahoma, Verdana, Geneva, sans-serif;
	background: #fff url(imagenes/fondo.jpg) 50% 0 fixed no-repeat;/* el 50% "o center" al centro de la web*/
	color: #000;/* textos NEGROS*/
}
#contenedorprincipal {/* CONTENEDOR PRINCIPAL para que nada se salga de le imagen backround aki pondre la cabecera primero*/
	width: 750px;
	margin: 0 auto;
	text-align: center;
}
#cabecera{
    height::250px;
	width: 750px;
}
#cuerpo{
	width: 730px;
	padding:30px 10px;;
	}

baccxus · #2 (**permalink**) 12/03/2009, 15:58

Deberías poner un link a tu página o poner capturas de pantalla, porque en mi monitor con el código que pusiste no veo problemas.

suerte

artelomano · #3 (**permalink**) 12/03/2009, 16:22

listo subida a artelomano/forosdelweb
poniendo eso en el navegador deberia de salir
ya funciona en explorer y firefox pero en safari y opera aun estamos en las mismas

y lo curioso nose si sera normal pero..... al agrandar o achicar la ventana del navegador muy pokito a poko vailotean las imagenes en todos los navegadores. ¿estoy haciendo algo mal??

muchas gracias

baccxus · #4 (**permalink**) 12/03/2009, 16:48

Creo que, según mi forma de verlo, deberías usar las imágenes del encabezado y del pie de página como background y otros detallitos como por ejemplo tener todo dentro del contenedor:

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
	<meta http-equiv="content-type" content="text/html; utf-8" />
	<meta name="author" content="Dave Shea" />
	<meta name="keywords" content="palabras claves" />
	<meta name="description" content="descipcion de web" />
	<meta name="robots" content="all" />
	<title>Titulo de la web</title>

	
	
<style>

*,body {
	margin: 0;
	padding: 0;
}
body {
	font: normal 12px Arial, Tahoma, Verdana, Geneva, sans-serif;
	background: #fff url(imagenes/fondo.jpg) 50% top fixed no-repeat;/* el 50% "o center" al centro de la web*/
	color: #000;/* textos NEGROS*/
}
#contenedorprincipal {/* CONTENEDOR PRINCIPAL para que nada se salga de le imagen backround aki pondre la cabecera primero*/
	width: 750px;
	margin: 0 auto;
}
#cabecera{
    margin: 0;
	position:relative;
	width: 750px;
	height: 250px;
	background: url(/pruebas/imagenes/cabecera.jpg) no-repeat top center;
}
#pie{
	margin: 0;
	background: url(/pruebas/imagenes/pie.jpg) bottom center no-repeat;
	width: 750px;
	height: 50px;
}
#cuerpo{
	width: 730px;
	padding:30px 10px;;
}

</style>
</head>
<body>

<div id="contenedorprincipal">
<div id="cabecera"></div><!--// Final de encabezado//--> 
<div id="cuerpo">
  <p>Colocar aquÃ el contenido para  class "contenedoffffffffffff
    
    ffffff ff f ff f ff f fffffffffffmmm todo akii!!!!!!!!sssss sssssss ssss sssss sssss sssss ssssss sss s sss  ssss shhh sss ss s s s s sssss sss sss s ssssssssss!r" <br />
    hh<br />
    h<br />
    h<br />
    
    h<br />
    h<br />
    g<br />
    t<br />
    e<br />
    g<br />
    
    k<br />
    
    
    y<br />
    y<br />
    y</p>
  </div>
<!--// Final de cuerpo//--> 
<div id="pie"></div>
<!--// Final de pie //--> 
</div><!--// Final de contenedor //--> 

</body>

</html>

PD: Tu código en mi pantalla se desfazaba en FF y no en IE7, sólo lo probé con estos 2, pero creo que no deberías tener problemas.

Suerte

artelomano · #5 (**permalink**) 12/03/2009, 17:05

mmm en css puedo tener de background un flash? porque mas para alante kiero hacer la cabecera q sea en flash y alavez contenga el menu ahi dentro del flash cabecera.

css aguanta un flash de background??

probe tu codigo y parece q va mejor la cosa ahora,
pero una cosita arriba de la cabecera y abajo del pie ahi como un margen y se me escapan los bordes por ahi e actualizao la web asi q.. si le hechas un vistazo te lo agradeceria.

artelomano/forosdelweb

y muchisimas gracias por la respuesta me a sido de mucha ayuda

baccxus · #6 (**permalink**) 12/03/2009, 17:31

Para la primera pregunta: Poner un flash de background, la respuesta es NO, puedes insertarlo en tu encabezado sin ningún problema aún con el background que acabamos de hacer, si quieres que se vea el background usas Wmode=transparent en la inserción del flash (eso es ya otro tema).

y para la segunda: Pues le haces un padding (a la cabecera y al pie de página), por ejemplo de 10px por cada lado y al tamaño del div le mermas 20px;

Código:

width: 730px; /*Era de 750px, pero como le agregaremos 10px por cada lado...*/
padding: 0 10px;/*arriba-abajo izquierda-derecha*/