Problema con DIVS

jimadri · #1 (**permalink**) 10/01/2011, 06:40

Hola, tengo el siguiente problema con DIVS:

Inserto el primer div en mi html y le agrego el contenido que deseo. Hasta acá perfecto. Ahora, cuando le quiero insertar un nuevo div, éste solo se acomoda alrededor del primero y no me deja agregarla sobre el primer div.
Qué estoy haciendo mal?? Lo raro que en una pc si puedo y en otra no y ambas con la misma version de CS5.

Gracias!

GAST0N · #2 (**permalink**) 10/01/2011, 07:12

podrias pegar el codigo para ver .. saludos =)

jimadri · #3 (**permalink**) 10/01/2011, 07:19

Hola Gastón! te paso el 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>Untitled Document</title>
<style type="text/css">
#apDiv1 {
position:absolute;
width:1024px;
height:54px;
z-index:1;
left: 143px;
top: 329px;
}
#apDiv2 {
position:absolute;
width:200px;
height:115px;
z-index:1;
left: 443px;
top: 114px;
background-color: #000033;
}
#apDiv3 {
position:absolute;
width:304px;
height:256px;
z-index:3;
left: 60px;
top: -257px;
}
</style>
</head>

<body>
<div id="apDiv1"><img src="img/top_barra.jpg" width="1024" height="54" />
<div id="apDiv3"></div>
</div>
</body>
</html>

GAST0N · #4 (**permalink**) 10/01/2011, 07:44

esta todo mal maquetado... me gustaria saber a que resultado te gustaria llegar...

mira, hace en el paint o photoshop algo asi como la imagen que te muestro, con el nombre de los div..

para saber a q resultado queres llegar... si te digo como hacerlo ahora, te va a quedar todo mal...

jimadri · #5 (**permalink**) 10/01/2011, 08:26

Cita:

Iniciado por GAST0N

esta todo mal maquetado... me gustaria saber a que resultado te gustaria llegar...

mira, hace en el paint o photoshop algo asi como la imagen que te muestro, con el nombre de los div..

para saber a q resultado queres llegar... si te digo como hacerlo ahora, te va a quedar todo mal...

A ver si entendí ahora: un DIV (contenedor) debe contener a otros DIVS como CABECERA, PIE, ETC?

Es asi? Y cómo los ubico uno arriba de otro?

jimadri · #6 (**permalink**) 10/01/2011, 08:28

Ya hice el dibujo y ahora como logro que cada uno ocupe ese lugar que dispuse en paint?

GAST0N · #7 (**permalink**) 10/01/2011, 08:34

Cita:

Iniciado por jimadri

Ya hice el dibujo y ahora como logro que cada uno ocupe ese lugar que dispuse en paint?

quiero verlo asi me doy una idea de como lo queres posicionados a los div

jimadri · #8 (**permalink**) 10/01/2011, 08:48

Te sirve?

GAST0N · #9 (**permalink**) 10/01/2011, 08:52

si, sta bien... ahora lo armo

jimadri · #10 (**permalink**) 10/01/2011, 09:02

Cita:

Iniciado por GAST0N

si, sta bien... ahora lo armo

Con tu ayuda creo que voy a poder realizar otras cosas que no terminé por culpa de los DIVS.
Muchas gracias de ante mano.
Espero tu ayuda.

GAST0N · #11 (**permalink**) 10/01/2011, 09:50

perdon por la tardansa

proba asi haber si es lo que queres... recorda que yo puse las medidas que yo quise, vos despues modificas eso para que quede a tu medida..

CSS

Código:

#contenedor{
	width: 950px;
	height: auto;
	margin: 0 auto;
}

#top{
	background-color: red;
	width: 950px;
	height: 100px;
	float: left;
}

#contenido{
	width: 550px;
	height: 350px;
	background-color:green;
	float: left;
}

#sidebar{
	height: 350px;
	width: 350px;
	float: left;
	margin-left:50px;
}

#pie{
	background-color:#ff5934;
	width: 950px;
	height: 30px;
	float:left;
}

.logo{
	width: 300px;
	height: 200px;
	position: absolute;
	background-color:gray;
	top: 150px;
	left:530px;
}

.login{
	height: 110px;
	width: 350px;
	float: left;
	background-color:blue;
}

.banner{
	height: 110px;
	width: 350px;
	float: left;
	background-color:red;
	margin-top:10px;
}

.banner2{
	height: 110px;
	width: 350px;
	float: left;
	background-color:blue;
	margin-top:10px;
}

En el HTML

Código PHP:

  <div id="contenedor">
  <div id="top"></div>
  <div id="contenido">
    <div class="texto"></div>
  </div>
  <div class="logo"></div>    
  <div id="sidebar">
    <div class="login"></div>
    <div class="banner"></div>
    <div class="banner2"></div>
  </div>
  <div id="pie"></div>    
</div>

jimadri · #12 (**permalink**) 10/01/2011, 10:06

Perfecto! la pregunta es: qué diferencia hay con ubicarlas a mi gusto miestras muevo los divs en la visión diseño de Dreamweaver?
Asi lo hice en una de las pc pues en otra ya no.
Otra cosa que me pasó es que agregaba un div y se ocultaba atras de el primer div.

Por qué pasa eso?

Muchas Gracias por la mano que me acabas de dar!!!

GAST0N · #13 (**permalink**) 10/01/2011, 10:11

no te recomiendo que armes div desde la vista de diseño de Dreamweaver , si agregas un div tenes que darle nuevas reglas.. ademas depende del resto de los div...y depnde donde agregues ese div..

donde queres agregar otro?

jimadri · #14 (**permalink**) 10/01/2011, 10:15

El que armé de manera improvisada lo hice insertando divs a cada uno lo ubicaba arrastrandolo hasta el lugar que quería y obviamente todo el css se generaba automaticamente.

GAST0N · #15 (**permalink**) 10/01/2011, 10:23

Cita:

Iniciado por jimadri

El que armé de manera improvisada lo hice insertando divs a cada uno lo ubicaba arrastrandolo hasta el lugar que quería y obviamente todo el css se generaba automaticamente.

nada mejor que crear el css mediante codigo escrito manualmente... de esa manera vas a tener todo bajo control porque vas a entender cada linea que armaste vos

jimadri · #16 (**permalink**) 10/01/2011, 10:29

Perfecto! sigo esa recomendación. Muchas gracias por tu ayuda!

GAST0N · #17 (**permalink**) 10/01/2011, 10:31

ok ya sabes si necesitas ayuda, mandame un mensaje privado , tambien agregame a facebook si queres, entra a mi perfil de foros del web, ahi esta el link para mi face y twitter

saludos!