Opzina, en principio, te vuelvo a repetir, porque me parece que tenes un error de concepto, con CSS no podes realizar ese tipo de ilustraciones, lo que vos tenes que hacer es lo siguiente:
LA IMAGEN QUE VOS QUERES REALIZAR MIDE 246 X182 PX Y ES UN JPG, POR ENDE LO QUE TENES QUE HACER CON CSS ES INCRUSTAR O ADJUNTAR ESTA IMAGEN A TU LIENZO O PAGINA O BODY, OK? LO QUE NO PODES HACER ES REALIZAR LA IMAGEN CON CSS, ESPERO QUE ESO HAYA QUEDADO CLARO.
TEPASO EL CODIGO PARA HACERLO:
(SUPONIENDO QUE TU IMAGEN SE LLAMA CAJA.JPG Y ESTA ALOJADA EN UNA CARPETA LLAMADA IMAGENES)
1-EN HTML, GENERAS EL DIV DONDE VOS QUIERAS PONER LA IMAGEN
<div id="imagen"></div>
2-EN CSS COLOCAS LA IMAGEN
#imagen{
width:246px;
height:182px;
background-image: url(imagenes/caja.jpg);
background-repeat:no-repeat;
background-position:center;
}
hay otras maneras de hacerlo, te paso el codigo que se me ocurre ahora, tambies podes pones la imagen en el html con un tag img, o en lugar de usar en css background-image, usar background: eso depende de como te quede mas comodo, ahora si no entendes nada de lo acabo de escribir, bueno, tenes que empezar de cero con css y html.
Espero haberte ayudado. Saludos.-