CSS Border Radio no funciona en Safari después de cambiar a gatsby-plugin-imagen

Question 1

en mi laptop puedo ver la radio frontera de la imagen, pero parece que no funciona en el iphone o iPad. (es decir, la imagen es cuadrada en el iPhone / iPad, no veo border-radius:espacio de 25 píxeles situado ser aplicado a la imagen)

EDITAR 11-24: lo siento, este es el fragmento de código que estoy usando el estilo-componente

export const MyImageContainer = styled(GatsbyImage)`
  cursor: pointer;
  border-radius: 25px;
`

Question 2

Sí, es una vieja 'bug'. Este css hack debería solucionar el problema.

-webkit-mask-image: -webkit-radial-gradient(white, black);

Question 3

Tengo problema similar con radio frontera después de migrar a gatsby-plugin-imagen.

No estoy seguro si esto se refiere a su pregunta, es posible que desee agregar más detalles y algunos fragmentos de código que será útil.

Estoy usando el estilo-componente para mi proyecto. Mi solución fue el objetivo de la img

Por ejemplo

export const MyImageVariable = styled(GatsbyImage)`
 border-radius: 50%;
  img {
    border-radius:50%;
   }
`

LSE · Answer 1 · 2021-11-24T05:08:47

Sí, es una vieja 'bug'. Este css hack debería solucionar el problema.

-webkit-mask-image: -webkit-radial-gradient(white, black);

Code_Like_a_Newbie · Answer 2 · 2021-11-24T05:09:41

Tengo problema similar con radio frontera después de migrar a gatsby-plugin-imagen.

No estoy seguro si esto se refiere a su pregunta, es posible que desee agregar más detalles y algunos fragmentos de código que será útil.

Estoy usando el estilo-componente para mi proyecto. Mi solución fue el objetivo de la img

Por ejemplo

export const MyImageVariable = styled(GatsbyImage)`
 border-radius: 50%;
  img {
    border-radius:50%;
   }
`

CSS Border Radio no funciona en Safari después de cambiar a gatsby-plugin-imagen

Pregunta

Mejor respuesta

En otros idiomas

Esta página está en otros idiomas

Popular en esta categoría

Las preguntas más habituales en esta categoría