2

he intentado optimizar mi código CSS mediante el uso de shorthand, específicamente con la propiedad background, el problema se dá cuando quiero incorporar la propiedad background-size en el shorthand. por favor agradecería su ayuda ya que anduve averiguando y no logré dar con la solución, no sé si tenga mucho que ver el orden en la que van los valores dentro del shorthand.

Este es el HTML

<p><a href="mailto:jean@dominio.com">JEAN LEON: Director Comercial.</a></p>
<p><a href="mailto:shey@dominio.com">SHEYLA RIOS: Jefa de Ventas.</a></p>

Aquí el código extendido sin usar shorthand (validada por la W3C):

a[href^="mailto"] {
background: url("../imagenes/mail.png") left center no-repeat;
background-size: 1.5em;
padding-left: 40px;}

https://jigsaw.w3.org/css-validator/introducir la descripción de la imagen aquí

Usando Shorthand devuelve Error.

a[href^="mailto"] {
background: url("../imagenes/mail.png") 1.5em left center no-repeat;
padding-left: 40px;}

introducir la descripción de la imagen aquí

1 respuesta 1

5

Actualemente la propiedad background acepta los siguientes valores:

Sintaxis:

background: [background-color || background-image || background-repeat || background-attachment || background-position] | inherit ;

A partir de CSS3, se ha propuesto agregar las propiedades background-size, background-origin y background-clip. Aquí se puede encontrar el borrador

La propiedad background-size, aún no es un valor válido que deba establecerse usando el atajo background. Es decir, se puede establecer, va a funcionar (en los navegadores nuevos) pero aún no es estándar, por eso no es válido.


Referencias:

MDN - CSS > Background > Specifications

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.