Foros del Web » Creando para Internet » CSS »

como hacer que un div este al lado del otro?

Estas en el tema de como hacer que un div este al lado del otro? en el foro de CSS en Foros del Web. tengo un div principal de 800px de ancho, y quiero que dentro hallan 2 divs de 400px de ancho, uno alado del otro. esto es ...
  #1 (permalink)  
Antiguo 21/11/2010, 14:40
 
Fecha de Ingreso: septiembre-2010
Mensajes: 137
Antigüedad: 7 años, 2 meses
Puntos: 0
como hacer que un div este al lado del otro?

tengo un div principal de 800px de ancho, y quiero que dentro hallan 2 divs de 400px de ancho, uno alado del otro.

esto es lo de la hoja de estilo:

#principal {width:800px}
#div1 {width:400px}
#div2 {width:400px}

eso es lo que tengo en el html:

<html>
<head>
<title>titulo</title>
<link rel="stylesheet" href="estilo.css" type="text/css" media="all">
</head>
<body>
<div id="principal">
<div id="div1">
<p>parrafo</p>
</div>
<div id="div2">
<p>parrafo</p>
</div>
</div>
</body>
</html>
  #2 (permalink)  
Antiguo 21/11/2010, 14:56
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.049
Antigüedad: 8 años, 7 meses
Puntos: 1484
Respuesta: como hacer que un div este al lado del otro?

¿sabes lo que son elementos tipo bloque y lineal? pues por ahi va tu tema. los elementos tipo bloque se "renderizan" cada una en una nueva linea mientras que los lineales tienen un flujo contigüo. hay varias propiedades para cambiar ese comportamiento pero la que mejor te conviene es float.
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.
  #3 (permalink)  
Antiguo 22/11/2010, 02:27
 
Fecha de Ingreso: enero-2010
Mensajes: 11
Antigüedad: 7 años, 10 meses
Puntos: 1
Respuesta: como hacer que un div este al lado del otro?

Usando float como te dijeron ;).

#principal {width: 800px;}
#div1 {width: 400px; float: left:}
#div2 {width: 400px; float: left;}

Tambien podes cambiar los widths a 50% para que abarquen la mitad cada uno, siempre y cuando no uses padding en el principal o margin en los div1 o div2, sino vas a tener problemas:
#div1 {width: 50%; float: left:}
#div2 {width: 50%; float: left;}

Si el div #principal no baja del todo, inclui un div de 'class="clear"' al fondo:
.clear {clear: all;}


Saludos!

Etiquetas: lado
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 11:15.