Foros del Web » Creando para Internet » CSS »

Capa al 50%

Estas en el tema de Capa al 50% en el foro de CSS en Foros del Web. Hola, tengo este codigo XHTML: Código HTML: <div id= "barra" > <div id= "barra_izq" > asdf </div> <div id= "barra_der" > adsf </div> </div> y ...
  #1 (permalink)  
Antiguo 01/08/2007, 12:23
 
Fecha de Ingreso: enero-2007
Mensajes: 405
Antigüedad: 10 años, 11 meses
Puntos: 3
Capa al 50%

Hola, tengo este codigo XHTML:

Código HTML:
<div id="barra">
	<div id="barra_izq">asdf</div>
	<div id="barra_der">adsf</div>
</div> 
y el CSS:

Código HTML:
#barra{
width:100%;
}
#barra_izq{
width:50%;border:1px solid red;
}
#barra_der{
width:50%;border:1px solid red;
}
Los bordes estan puesto para ver como se colocan.

quiero que se vea asi:

|start_Izq end_Izq | start_Der end_der |

es decir, que #barra_izq ocupa el 50% de la pagina, y #barra_der el otro 50%

y ahora mismo se ve asi:

|start_Izq end_Izq |
|start_Der end_der |


Saludos
  #2 (permalink)  
Antiguo 01/08/2007, 16:04
Avatar de emiliodeg  
Fecha de Ingreso: septiembre-2005
Ubicación: Córdoba
Mensajes: 1.830
Antigüedad: 12 años, 3 meses
Puntos: 54
Re: Capa al 50%

o usas
#barra_izq{
float:left;width:50%;border:1px solid red;
}
#barra_der{
float:left;width:49%;border:1px solid red;
}
o utilizas posicionamiento absoluto para uno en top:0;left:0;y para el otro top:0;right:0;
__________________
Degiovanni Emilio
developtus.com
  #3 (permalink)  
Antiguo 01/08/2007, 16:59
 
Fecha de Ingreso: enero-2007
Mensajes: 405
Antigüedad: 10 años, 11 meses
Puntos: 3
Re: Capa al 50%

gracias emiliodeg, funciona perfecto.

Lo que no entiendo es xq flotando los dos a la izquierda funciona...y xq ese 49%...



Saludos
  #4 (permalink)  
Antiguo 01/08/2007, 18:32
Avatar de demiurgo_daemon  
Fecha de Ingreso: diciembre-2006
Ubicación: Querétaro
Mensajes: 184
Antigüedad: 11 años
Puntos: 2
Re: Capa al 50%

Hola,

se flotan porque <div> es un elemento de bloque; significa que aunque le des un ancho definido, se "reserva" el resto de la pantalla. Lo del 49% es porque el ancho que defines no incluye bordes; en otras palabras: si defines width: 50% para ambos, en realidad su ancho será de 50% + 1px (por el borde). En este caso, el total será de 100% + 2px, que forzozamente se desborda.

saludos
  #5 (permalink)  
Antiguo 01/08/2007, 18:35
Avatar de demiurgo_daemon  
Fecha de Ingreso: diciembre-2006
Ubicación: Querétaro
Mensajes: 184
Antigüedad: 11 años
Puntos: 2
Re: Capa al 50%

Cita:
Iniciado por demiurgo_daemon Ver Mensaje
Hola,

se flotan porque <div> es un elemento de bloque; significa que aunque le des un ancho definido, se "reserva" el resto de la pantalla. Lo del 49% es porque el ancho que defines no incluye bordes; en otras palabras: si defines width: 50% para ambos, en realidad su ancho será de 50% + 1px (por el borde). En este caso, el total será de 100% + 2px, que forzosamente se desborda.

saludos
  #6 (permalink)  
Antiguo 02/08/2007, 02:34
 
Fecha de Ingreso: enero-2007
Mensajes: 405
Antigüedad: 10 años, 11 meses
Puntos: 3
Re: Capa al 50%

Totalmente aclarado, gracias demiurgo_daemon



Saludos
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:30.