alinear divs

el_tigre · #1 (**permalink**) 03/05/2013, 09:59

Amigos una simple duda.....si tengo un contenedor prinicipal alineado a la izquierda (float: left) y dentro de ella quiero alinear dos DIVs uno a la izquierda y otro a la derecha....¿cómo podría hacerlo? he intentado ponerle Float:left a ambos y siempre me sale una debajo de otra....

Actualmente se ve así.....
[CONTENDOR (float:left)]
DIV 1 (float:left)
DIV 2 (float:left)
[/CONTENEDOR]

También probé así:
[CONTENDOR (float:left)]
DIV 1 (float:left)
DIV 2 (float:Rigth)
[/CONTENEDOR]

Quisiera tenerlo así

[CONTENDOR (float:left)]
DIV 1 (float:left) DIV 2 (float:?)
[/CONTENEDOR]

Saludos

pzin · #2 (**permalink**) 03/05/2013, 10:10

Pues si no aportas código y sólo esa cosa será difícil ver qué pasa.

Aunque después de siete años y ochocientos mensajes tendrías que tenerlo claro.

herzbazi · #3 (**permalink**) 03/05/2013, 10:36

hola amigo seria bueno y prudente que pongas codigo siempre no importa si no sabes o si sabes que esta mal aqui todos estamos para ayudarnos

ahi va el codigo espero te funcione y sea esto lo que buscas

y si te ayude sumame un punto ,,, nos vemos

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8" />
<title>mi titulo</title>
<style type="text/css">
#cont{
position:absolute;
width:700px;
border:1px solid #000;
left:50%;
margin-left:-350px;
}
.caja{
position:relative;
float:left;
width:300px;
height:300px;
border:1px solid #009;
margin:20px;
}
</style>
</head>

<body>
<div id="cont">
<div class="caja"></div>
<div class="caja"></div>
</div>
</body>
</html>

el_tigre · #4 (**permalink**) 03/05/2013, 10:43

Cita:

Iniciado por pzin

Pues si no aportas código y sólo esa cosa será difícil ver qué pasa.

Aunque después de siete años y ochocientos mensajes tendrías que tenerlo claro.

Lo que pasa es que esto no es lo mío, de vez en cuanto toco themas y allí surgen las dudas cuando no puedo hacerlo.

estos son mi código que van dentro (CSS)

Código HTML:

.site-content {float: left;}

.izquierda {float:left;}
.derecha {float:left;}

esto es el HTML

Código PHP:

  <div id="primary" class="site-content">

 
<div class="izquierda">

    mi texto 1

</div>

 
<div class="derecha">

    mi texto 2

</div>

<br>

.

.

.

el_tigre · #5 (**permalink**) 03/05/2013, 10:52

herzbazi, tu código funciona a la perfección pero no funciona en mi página (Wordpress), algo está obstaculizando el funcionamiento correcto.... :(

pzin · #6 (**permalink**) 03/05/2013, 10:53

Ese código tal cual funciona como esperas.

Lo que puedes hacer es especificarle un ancho, por ejemplo de 50% a cada uno:

Código CSS:

Ver original.site-content > div {
  width: 50%;
}

Si no te vale así y lo tienes subido en algún sitio pásanos la URL para verlo in situ.

herzbazi · #7 (**permalink**) 03/05/2013, 10:56

Cita:

Iniciado por el_tigre

herzbazi, tu código funciona a la perfección pero no funciona en mi página (Wordpress), algo está obstaculizando el funcionamiento correcto.... :(

ok como dije nuestro amigo y compañero, si tienes en algun server este wordpress pasalo y con gusto te apoyo..

veamos si lo resolvemos

el_tigre · #8 (**permalink**) 03/05/2013, 11:02

Este es mi web el problema está en el adsense.....

pzin · #9 (**permalink**) 03/05/2013, 11:06

Pues lo que te decía, y le añades un overflow por si acaso.

Código CSS:

Ver original.izquierda {
  float: left;
  width: 50%;
  overflow: hidden;
}

el_tigre · #10 (**permalink**) 03/05/2013, 11:11

No quiere amigo...... jeje

herzbazi · #11 (**permalink**) 03/05/2013, 11:16

hay una etiqueta ins coloca en el style esto

left:400px;top:-300px;position:relative;float:left;

reemplaza por este codigo ,,, busca ahi la etiqueta ins y reemplaza

http://imageshack.us/photo/my-images/855/imagenuh.png/

pzin · #12 (**permalink**) 03/05/2013, 11:17

¿Estás haciendo los cambios directamente en el hosting? Porque yo no veo ninguna regla para la clase .izquierda.

herzbazi te veo con cierta fijación en usar valores negativos.

No hace falta en este caso, es más limpio flotarlos y darles un ancho.

herzbazi · #13 (**permalink**) 03/05/2013, 11:19

mira
lo que te mande
ahi queda como quieres en la etiquete ins coloca eso pues si mal no estoy es parte del link que te da adsense entones tienes que modificar

esto esta en el html no en el css es donde tienes el code de adsense

pzin · #14 (**permalink**) 03/05/2013, 11:22

No hay ningún elemento ins en el código fuente. Lo inyecta el propio JavaScript.

herzbazi · #15 (**permalink**) 03/05/2013, 11:24

es cierto podemos hacer eso tambien ,,,,,

y si es dentro del js del adsense donde esta el ins

viste ya la imagen ?

el_tigre · #16 (**permalink**) 03/05/2013, 11:28

Cita:

Iniciado por pzin

¿Estás haciendo los cambios directamente en el hosting? Porque yo no veo ninguna regla para la clase .izquierda.

herzbazi te veo con cierta fijación en usar valores negativos.

No hace falta en este caso, es más limpio flotarlos y darles un ancho.

Quedó amigos.....me quedé pensando cuando dijiste que no ves ninguna regla....usando el firebug....tampoco encontraba nada jejeje......cambié de lugar el CSS que me diste y funcionó de maravilla.

herzbazi · #17 (**permalink**) 03/05/2013, 11:30

cual css
?

el_tigre · #18 (**permalink**) 03/05/2013, 11:34

http://www.forosdelweb.com/4422971-post9.html