¿Cómo hago un caja con css?

Estoy haciendo una web de divulgación, el dissenño es sencillo una foto de fondo i un box de margenes redondos al centro. Ahí va mi problema, ¿no se como hacer el box ni como ponerlo centrado ni como puedo poner que el menu se adapte al tamaño del box. Cómo lo hago?

1 respuesta

Respuesta
1
Te indico que el tema de los bordes no se puede hacer con css, no permite crear bordes redondeados (aun).
Si lo que quieres es una imagen de fondo y una caja que siempre quede en el medio el código css es el siguiente.
body {background: url(direccion de la foto de fondo); }
.caja_base {margin: 0 auto 0 auto; width: 800px; height: 500px;}
//* Margin determina, margen superior, derecho, inferior e izquierdo
luego dentro del body creas un div asi
<div class="caja_base"></div>
Y ya tienes una caja de 800 x 500 pixeles que siempre estará centrada horizontalmente.
Muchas gracias
¿Para qué se vean los bordes que debería hacer? ¿Y Para ajustar el menu css al tamaño de la caja?
Muchas garcías
¿A qué te refieres con ajustar el menu css al tamaño de la caja?, aclarame y te hecho una mano.
Para el borde.
.caja_base {margin: 0 auto 0 auto; width: 800px; height: 500px; border: 1px solid #CCC}
Tamaño, Grosor y Color.
De todas formas te dejo un link que a mi me ayuda mucho.
http://www.librosweb.es/referencia/css/
Hola, muchas gracias la web me ha ido muy bien. Quiero poner una imagen de fondo y después poner una caja en el centro i dentro de la caja divirlo en el contenido un menu horitzontal i una barra lateral donde poner un indice de la web.
¿Al poner el menu en la caja no se ajusta al tamaño que tine la caja i me sigue ocupando todo toda la página? ¿Cómo ajusto el menu apra que me ocupe el tamaño que tiene la caja?
Espero haberme explicado
Muchas gracias
Es bastante simple.
Si pongamos que tenemos la caja base
.caja_base {margin: 0 auto 0 auto; width: 800px; height: 500px; border: 1px solid #CCC}
Y queremos meter otra caja superior dentro, una izquierda y otra más grande al lado, este es el código.
.caja_base {margin: 0 auto 0 auto; width: 800px; height: 500px; border: 1px solid #CCC}
.menu_superior {height: 50px;}
.menu_izq { width:200px; height:auto; float:left;}
.caja_der { width:600px; height:auto; float:left;}
<div class="caja_base">
<div class="menu_superior">Menu superior</div>
<div class="menu_izq">Menu Izquierda</div>
<div class="caja_der">Caja derecha</div>
<div style="clear:both;"></div>
</div>
Muchísimas gracias! :)
Pues ya lleva bastante tiempo que no conseguía resolver la duda
Deja la pregunta abierta por si me sale algún imprevisto pero cuando la cierre me acordare de puntuar un 10
Ultima pregunta :)
¿Si quiero que el fondo de la caja base sea blanco o cualquier otro color como se haría?
Muchas gracias
.caja_base {margin: 0 auto 0 auto; width: 800px; height: 500px; border: 1px solid #CCC; background: #FFFFFF;}
Solo necesitas cambiar el código de background por el código de color que quieras poner de fondo.

Añade tu respuesta

Haz clic para o
El autor de la pregunta ya no la sigue por lo que es posible que no reciba tu respuesta.

Más respuestas relacionadas