maquetar caja

[enrique4480]

Hola intento hacer una caja de contenido, sin cambiar nada tiene que ser capaz de adaptarse tanto horizontal como verticalmente. lo tengo que hacer con imagenes, lo que es la parte de arriba y la de bajo lo tengo claro con 2 divs uno a derecha y otro a izquierda (ya que hay borde en color y redondeado en la imagen). el problema se me presenta en el contenido, si fuese solo en vertical lo tengo claro, no veo tan claro el tema de que se adapte horizontalmente. ¿alguna idea?.

no quiero codigo, solo ideas. para que se entienda la caja serio tipo esto:



no tan sencilla pero para que se entienda el problema horizontal con borde de otro color.

[comablck]

ahi solo q cortes las esquinas redondeadas por separado, es decir, por cada esquina seria un div.. y asi como tenes los bordes a los lados los podes tener arriba y abajo.. y obviamente todo debe estar en un div contenedor, espero te ayude

[mariomon17]

No seria mas facil no complicarte y utilizar CSS3?

Código CSS:

div {
      border-radius: 5px;
}
 

Un saludo :)

[clpef]

Ok,

Primero sacas la parte de arriba (de un alto de pocos pixeles)...
luego sacas una parte del medio de 1 o 2 px (Esta imagen se repetirá en el div del medio)
Y finalmente sacas la parte de abajo tambien de algunos pocos pixeles

ahora creas un div que contenga tres div mas

<div > // contenedor
<div> // contiene solo la parte de arriba con un ancho y alto fijo y la imagen que corresponde como backgraund
</div>

<div> // Aqui se repite la imagen del medio solo verticalemente
</div>

<div> // aqui se pone la imagen de abajo de la misma forma que lo has echo arriba
</div>

</div>

suerte!

[enrique4480]

el maquetar cajas fijas (o variables) lo tengo claro, las esquinas redondas etc no es el problema. si repito la imagen en el cuerpo de la caja se repiten (horizontalmente el borde). es decir con el mismo codigo quiero hacer una caja de cualquier tamaño. no puedo usar css3, tiene que ser la imagen.

[mariomon17]

En ese caso puedes usar 9 divs. 4 para cada esquina(tamaño fijo). 4 para los brdes. 1 para el contenido. (Tamañ9 variable)

De todas maneras, estaria bien que googlearas un poco. Seguro que hay soluciones mucho mas sencillas.

Por ultimo, insistiria en CSS3. Si el problema es la compatibilidad, puedes usar CSS PIE entre otros.

Un saludo :)

[enrique4480]

si, he buscado pero realmente poco encuentro. el tema de hacerlo con divs era lo principal que pense, pero claro para hacer una caja meter tanto div no me parece limpio. voy a pensar y si encuentro una solucion practica la pongo aqui y comentamos.

gracias a todos por las respuestas.

[mariomon17]

De todas maneras, que importa que sea limpio?
Osea, quiero decir son "necesarios".

Un saludo :)