Foros del Web » Creando para Internet » CSS »

Dos Divs en la misma linea

Estas en el tema de Dos Divs en la misma linea en el foro de CSS en Foros del Web. Buenas! Estoy preparando una pequeña pagina, MUY sencilla para cuando desactive el foro temporalmente, ya sea para añadir algun tipo de moficacion, para cambiar algo, ...
  #1 (permalink)  
Antiguo 12/11/2008, 17:53
 
Fecha de Ingreso: febrero-2008
Mensajes: 269
Antigüedad: 9 años, 9 meses
Puntos: 5
Dos Divs en la misma linea

Buenas!

Estoy preparando una pequeña pagina, MUY sencilla para cuando desactive el foro temporalmente, ya sea para añadir algun tipo de moficacion, para cambiar algo, limpieza etc...Y la tengo practicamente hecha, solo me falta añadir los afiliados, logicamente, para permanecer afiliados con ellos ya que si ven la pagina sin sus banners, seguramente quiten el mio de sus webs. El problema es que el alto de la pagina esta todo ocupado y no quiero que salga una barra de desplazamiento, la idea es que sea una pagina simple y solo con lo que se ve, entonces queria poner los afiliados a la izquierda, justo al lado del Div, que contiene la explicacion.

El verdadero problema, es que por mucho que intento cosas, el Div de los afiliados, se pone ENCIMA del Div de la explicacion o DEBAJO del Div de la explicacion y yo lo que quiero es que salga una al lado de otra, uso CSS ya que cada Div tiene un margen distinto (margin-top, margin-left....) dejo la URL para que podais verlo, cuando lo veais quitare la URL que no quiero hacer publico esto aun...

EDITED

Última edición por Vendetta; 15/11/2008 a las 07:04
  #2 (permalink)  
Antiguo 12/11/2008, 18:00
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Dos Divs en la misma linea

¿Y cuál es el div de los afiliados?

Aparte parece que te salen varios warning bajo el texto.
__________________
Visita mi nueva web idplus.org
  #3 (permalink)  
Antiguo 13/11/2008, 08:06
 
Fecha de Ingreso: febrero-2008
Mensajes: 269
Antigüedad: 9 años, 9 meses
Puntos: 5
Respuesta: Dos Divs en la misma linea

Cita:
Iniciado por Mikmoro Ver Mensaje
¿Y cuál es el div de los afiliados?

Aparte parece que te salen varios warning bajo el texto.
Si, si, los warning no se porque salen pero es por el login que he puesto al foro porque abajo, hay un chat que solo se ve, si te conectas, entonces prepare ese login para que puedan conectarse y hablar por el chat sin problema, el caso es que sale el warning ese pero bueno, mientras el login funcione...no le doy importancia al error.

El div de los afiliados es el Div que esta a la izquierda en 2 filas...el que esta mas apartado vamos...El codigo no lo habia puesto porque como sueles mirar el codigo fuente y de ahi mirar el CSS y asi ves lo que quieres siempre pues no habia puesto el codigo de ese div pero bueno, aqui te lo dejo:

Código HTML:
div.afitrans
  {
  width: 945px;
  height: 30px;
  background-color: #000000;
  /*text-align: center;*/
  margin-left: 70px ;
  /*border: 1px solid white;*/
  /* for IE */
  filter: alpha(opacity=80);
  /*CSS3 standard */
  opacity: 0.8;
  }
ese es el div. Claro, yo lo que quiero es que quede:

afiliados aqui ------------- chat aqui

el problema es que sale

afiliados aqui
chat aqui


Es decir, en vez de quedar los dos seguidos, lo que hace es bajar a la linea siguiente el div que viene despues.
  #4 (permalink)  
Antiguo 13/11/2008, 08:35
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Dos Divs en la misma linea

Pon en tu html primero el div.afitrans y después el div.transchat
Dale una anchura al div.afitrans y float: left. Además con propiedad display: inline.
A div.transchat déjalo sin posicionar, ponle también el display: inline. La anchura y altura fíjasela tú, porque aparece vacío (sin contenido) .

Juega con los márgenes de ambos para su separación, pero ten en cuenta la suma de los div+sus márgenes para que a resoluciones menores no se te pase abajo.
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #5 (permalink)  
Antiguo 13/11/2008, 09:16
 
Fecha de Ingreso: febrero-2008
Mensajes: 269
Antigüedad: 9 años, 9 meses
Puntos: 5
Respuesta: Dos Divs en la misma linea

He hecho eso (mas o menos) pero no me alinea los dos divs, provoca 2 Warnings y el div del chat se hace enano.

El transchat si tiene contenido solo que tienes que conectarte para poder verlo (de hecho, si pasas el raton veras que hay texto pero esta en color negro). Pongo aqui el codigo como lo habia modificado aunque no funcionaba:

Código PHP:
div.transchat
  
{
  
width690px;
  
height252px;
  
background-color#000000;
  
border1px solid white;
  
displayinline;
  
/*margin-left: 280px;*/
  /* for IE 
  filter:alpha(opacity=80);
  /* CSS3 standard 
  opacity:0.4; */
  
}

div.afitrans
  
{
  
width945px;
  
height30px;
  
background-color#000000;
  
floatleft;
  
displayinline;
  
/*text-align: center;*/
  /*margin-left: 70px ;*/
  /*border: 1px solid white;*/
  /* for IE */
  
filteralpha(opacity=80);
  
/*CSS3 standard */
  
opacity0.8;
  } 
La pagina la he dejado modificada para que veas lo que sucede...
  #6 (permalink)  
Antiguo 13/11/2008, 10:20
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Dos Divs en la misma linea

Bueno, pues la cuestión está en el "más o menos".
No has cambiado en el html el orden. Coloca primero el div de afiliados.
Tampoco has reparado en que la anchura de cada uno de los 2 div (690+945)
Y le fijas una altura un tanto escasa.

Ahora, que si no quieres meterte en el html y no te importa que los afiliados queden a la derecha, pues flota a la izquierda el chat y los afiliados los dejas sin posicionar.

De esta última forma yo lo veo así:

__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #7 (permalink)  
Antiguo 13/11/2008, 10:27
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Dos Divs en la misma linea

Sé que tú lo tienes muy claro, pero yo todavía no lo entiendo. Creo que será más fácil si me situas físicamente a través de los divs.

Tienes:

<div class="transbox">
<div class="minitrans">
<div class="afitrans2">
<div class="transchat">
<div class="afitrans">

¿Cómo los quieres ubicar exactamente?
__________________
Visita mi nueva web idplus.org
  #8 (permalink)  
Antiguo 13/11/2008, 11:17
 
Fecha de Ingreso: febrero-2008
Mensajes: 269
Antigüedad: 9 años, 9 meses
Puntos: 5
Respuesta: Dos Divs en la misma linea

Cita:
Iniciado por kseso? Ver Mensaje
Bueno, pues la cuestión está en el "más o menos".
No has cambiado en el html el orden. Coloca primero el div de afiliados.
Tampoco has reparado en que la anchura de cada uno de los 2 div (690+945)
Y le fijas una altura un tanto escasa.

Ahora, que si no quieres meterte en el html y no te importa que los afiliados queden a la derecha, pues flota a la izquierda el chat y los afiliados los dejas sin posicionar.

De esta última forma yo lo veo así:

Pues a mi no me sale y mira que he movido codigo xD, le he puesto un margin-top al div de afiliados y se ha movido todo o.O en vez de moverse solo ese div, ha bajado todo. He movido el div y lo he puesto en todos lados, he puesto el fload pero que no me sale...

Mikmoro, lo que quiero hacer es esto:

<div class="transbox">
<div class="minitrans">
<div class="afitrans2"><div class="transchat">
/*<div class="afitrans">*/ (si funciona el afitrans2 como quiero, este lo quito)
  #9 (permalink)  
Antiguo 13/11/2008, 12:12
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Dos Divs en la misma linea

Pues no estoy seguro del todo porque ahora veo cosas distintas, pero juraría que si lo pones donde lo tenías, le quitas el margen superior y le pones un float:left debería quedar como quieres:

Cita:
div.afitrans2 {background-color:#000000;
border:1px solid white;
float:left;
height:155px;
margin-left:0px;
opacity:0.8;
width:175px;
}
Eso estando situado donde lo tenías antes, en el orden que aparecía.
__________________
Visita mi nueva web idplus.org
  #10 (permalink)  
Antiguo 15/11/2008, 07:03
 
Fecha de Ingreso: febrero-2008
Mensajes: 269
Antigüedad: 9 años, 9 meses
Puntos: 5
Respuesta: Dos Divs en la misma linea

Ya lo coloqué como queria o.o

Muchas gracias a los dos ^^
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 17:17.