Propiedad Box-sizing y el Modelo de cajas en CSS

1. box-sizing nos permite establecer la forma en que se calculará el ancho y alto total de un elemento.

• Verdadero
• Falso

2. ¿Cuál es el valor por defecto de la propiedad box-sizing?

• border-box
• content-box
• padding-box
• Ninguna de las anteriores

3. En la imagen se muestra dos elementos div, los cuales comparten las siguientes propiedades CSS:

div {
width: 320px;
height: 160px;
border: 6px dashed chocolate;
padding: 10px;
margin: 20px;
}

¿Cuál de los divs utiliza la propiedad box-sizing:border-box; ?

• A
• B
• Los dos
• Ninguno

4. ¿Cuál es el tamaño del “Contenido” (área en blanco)?. El div tiene las siguientes propiedades CSS:

width: 300px;
height: 200px;
box-sizing:border-box; 

• 230 (ancho) x 130 (altura)
• 270 (ancho) x 170 (altura)
• 300 (ancho) x 200 (altura)
• Ninguno de los anteriores

5. ¿Cuál es el tamaño del “Contenido” (área en blanco)?. El div tiene las siguientes propiedades CSS:

width: 400px;
height: 300px;
box-sizing: content-box;

• 355 (ancho) x 155 (altura)
• 370 (ancho) x 270 (altura)
• 400 (ancho) x 300 (altura)
• Ninguno de las Anteriores