Foros del Web » Creando para Internet » CSS »

Dos div's en misma linea

Estas en el tema de Dos div's en misma linea en el foro de CSS en Foros del Web. Hola, foreros! Espero que me podais ayudar hacer esta estructura, jeje. Mirar tengo un div con una medida relativa, es decir, que puede variar de ...
  #1 (permalink)  
Antiguo 08/12/2008, 12:24
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
Dos div's en misma linea

Hola, foreros!

Espero que me podais ayudar hacer esta estructura, jeje. Mirar tengo un div con una medida relativa, es decir, que puede variar de 700px a 800px, por medio de javascript. Lo que busco es que el contenido de este div este compuesto por dos div. De esta forma:

-El primero de anchura: 100%.
-El segundo de 200px, pegado al primero.

Código HTML:
<div id='contenedor'>
	<div id='div_de_100%'>
	</div>
	<div id='div_de_200px'>
	<div>
</div> 
Pero lo importante es que esten en la misma linea... es decir, que por muy grande que sea el 'contenedor' el div 'div_de_100%' aumente de anchura pues tiene 100%, y el de 200px se mantenga pegado a su derecha siempre.

¿Como lo hago?... realmente creo que es imposible... jeje... ¿Que crees?
  #2 (permalink)  
Antiguo 08/12/2008, 12:41
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Dos div's en misma linea

A ver qué tal así:
en el css:
Cita:
#estrecho {
float: rigth;
width:200px;
display: inline;
/*otras propiedades*/
}
#ancho {
display: inline;
/*resto de propiedades*/
}
En el html:
Cita:
<div id="contenedor">
<div id="estrecho">
bla bla bla...
</div>
<div id="ancho">
bla bla bla ...
</div>
</div>
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #3 (permalink)  
Antiguo 08/12/2008, 14:07
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
Respuesta: Dos div's en misma linea

Hola, Kseso?

He probado el codigo que me das en IE, Firefox y Safari... y me muestra los div's con las dimensiones mas pequeñas posibles... es decir, que el div 'estrecho' no tiene 200px... y el div 'ancho' no tiene 100%. Si es que creo que es mucho mas dificil de lo que parece a simple vista... jeje.

He probado un monton de convinaciones... y nada de nada... jeje.

¿Se os ocurre alguna solucion?
  #4 (permalink)  
Antiguo 09/12/2008, 07:14
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Dos div's en misma linea

Hola Salbatore.
Cuando las cosas se hacen con más voluntad que rigor y paciencia se suelen cometer errores absurdos.
El siguiente código está probado en FF. Le he añadido unos colores de fondo y algún borde para que veas cada uno de los div´s.
Sólo tienes que llenar de contenido el de la izquierda para que crezca hasta ocupar toda la ventana menos los 200px del extrecho.
En el css
Cita:
#contenedor {
width:100%;
}
#estrecho {
border:1px solid #000000;
float:right;
padding:2px;
width:200px;
text-align:justify;
background-color:#202020;
/*otras propiedades*/
}
#ancho {
margin-right:220px;
text-align:justify;
background-color:#909090;
/*resto de propiedades*/
}
En el html
Cita:
<div id="contenedor">
<div id="estrecho">
bla bla bla...
</div>
<div id="ancho">
bla bla bla ... y mucho bla bla bla para que crezca y llene el espacio hasta el div estrecho
</div>
</div>
Pero seguro que con estas clases más adelante van a surjirte otras cosillas.
Ya se verán entonces.
Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #5 (permalink)  
Antiguo 09/12/2008, 10:18
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
Respuesta: Dos div's en misma linea

Hola, Kseso?

Muchas gracias por la ayuda, jeje. Era lo que buscaba, jeje. Realmente... los css me cuestan un monton... jeje. Nunca habia hecho eso con los margin, jeje... hacer un espacio con ellos para meter otro div, jeje.

Bueno... gracias!!!!!!!!!!.
  #6 (permalink)  
Antiguo 09/12/2008, 10:44
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Dos div's en misma linea

10-4 Salbatore.
Hay muchas páginas de "layouts" o plantillas. En este foro tienes este tema dedicado a páginas interesantes de css.
Mikmoro tiene publicados también algunos diseños aquí
Y en este enlace tienes un diseño de principal+sidebar derecho con cabecera y pie en diseño "líquido", esto es adaptado a la resolución de la ventana.

Espero te sirva alguno.
Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #7 (permalink)  
Antiguo 10/12/2008, 09:37
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
Respuesta: Dos div's en misma linea

Hola, kseso?...

Muchas gracias por las direcciones!... que sencillo de ver los modelos... jeje..

Me salvaran en mas de una ocasion.. jeje..

Gracias.
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 20:45.