Ayuda con los divs -.-

ezekinho · #1 (**permalink**) 07/02/2010, 23:16

Bueno, hoy me decidi maquetar mis webs con divs... toda mi vida lo hise con tablas... gran error jajaja. Pero bue estoy intentando inciarme en esto :D.

Ahora mi problema es el siguiente:

No puedo posicionar 2 divs en una misma linea. ¿Que estoy haciendo mal? o ¿Que le falta a mi CSS?

Me ayudan?

Codigo html

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=iso-8859-1" />
<title>Sin tablas</title>

<link href="estilos.css" rel="stylesheet" type="text/css" media="screen" />
</head>

<body>
<div  align="center" id="web">
  <div id="cabezera"><img src="imag/header.png" width="850" height="300" /></div>
  <div id="submenu"><img src="imag/menu.png" width="850" height="30" /></div>  
    <div id="cuerpo">
    <div align="left" id="isquierda">
	isquierda
	</div>
	<div  align="right" id="derecha">
	derecha
	</div> 
  </div>
</div>

</body>
</html>

Codigo CSS

Código:

body {
	background:#fff;
	margin:0
	
	
}

#web {
azimuth:center
}
#cabezera {width: 850px;
margin: 0px auto;
}

#cuerpo {witch: 850px;

#isquierda {width: 250px;
float:left;
} 



#derecha {width: 600px;
float:right;
}

Y ya que estamos esta es la web con tablas:
http://s2.subirimagenes.com/imagen/4027289web.png

Las fuentes que use para iniciarme en esto fueron la que posteo Mikmoro

Tutorial 1: http://www.forosdelweb.com/f53/aporte-pequena-guia-migracion-xhtml-css-648073
Tutorial 2: http://www.forosdelweb.com/f53/aporte-guia-migracion-xhtml-css-parte-ii-657814

daPhyre · #2 (**permalink**) 08/02/2010, 00:06

Creo que no estás cerrando una llave en "cuerpo". Aguas, estas y los punto y coma son de lo más importante, detalles como estos harán que todo tu CSS se descuadre por completo.

ArturoGallegos · #3 (**permalink**) 08/02/2010, 03:48

como ya te dijeron, siempre es muy importante cerrar las etiquetas del css con ;} por otra parte el atributo align es para las tablas según tengo entendido y a las imágenes siempre colócales el atributo alt o tu código no validara

daPhyre · #4 (**permalink**) 08/02/2010, 13:34

No es requerido terminar con ;}, aunque conviene por que luego al agregar nuevos atributos, a veces uno se olvida de poner un nuevo ;.

El atributo align está en el olvido!!

Y por cierto, ¿Para qué es esta línea? "azimuth:center"

Creo que lo que tu necesitabas es esto:

Código:

#web {width: 850px;
margin:0 auto
}

Tiene bastantes errores el código, eso podría explicar por que no actúa como debería :S

FaustinoAsprilla · #5 (**permalink**) 08/02/2010, 14:25

Hola, para centrar los divs en css simplemente debes darles márgenes automáticas a la izquierda y derecha:

#web
{
margin-left: auto;
margint-right: auto;
}

*Esto no funciona en IE6 y debes agregar text-align: center;

El width te recomiendo que lo uses solo en el div superior, por ejemplo en web... y en los que estén debajo lo señales en porcentajes (width: 100%;).

Agregale un clear: both; al id del encabezado.

Acuerdate de cerrar siempre las llaves y los puntoycoma!

Saludos

daPhyre · #6 (**permalink**) 08/02/2010, 22:06

Cita:

Iniciado por FaustinoAsprilla

*Esto no funciona en IE6 y debes agregar text-align: center;

¡Por supuesto que si funciona!

Solo hay que tener el DOCTYPE adecuado, y en el caso de esta página, si lo tiene.

FaustinoAsprilla · #7 (**permalink**) 09/02/2010, 07:56

Cita:

Iniciado por daPhyre

¡Por supuesto que si funciona!

Solo hay que tener el DOCTYPE adecuado, y en el caso de esta página, si lo tiene.

Vale la corrección

http://www.w3schools.com/tags/tag_DOCTYPE.asp