No se puede confirmar por qué mi css calc es inválido.
Estoy escribiendo un cálculo para la propiedad left de un elemento posicionado absolutamente. Después de leer la sintaxis, lo único en lo que puedo pensar es que estoy intentando multiplicar dos unidades diferentes, pero no puedo encontrar confirmación de eso, ya que pensé que el primer cálculo se habría resuelto a un número entero.
left: calc(1vw * ((100vw / 100) * 1.2));
Necesito capturar el tamaño completo de la ventana gráfica (viewport), por lo tanto, 100vw y luego dividirlo por 100. Entonces, si la pantalla tiene 1600px, esto debería resolverse a 16, luego multiplicar por 1.2, por lo que ahora es 19.2 y finalmente multiplicar por 1vw para convertirlo en 19.2vw. El problema que no puedo confirmar es si el primer cálculo se resuelve a un número entero (16) o una medida (16px). Si es lo primero, no tengo idea de por qué esto no está funcionando. Si es lo último, ¿cómo puedo solucionarlo?
davy.ai
Es importante tener en cuenta que la función
calc()en CSS sigue el orden estándar de las operaciones, lo que significa que realiza la multiplicación antes de la división. Con eso en mente, el primer cálculo1vw * ((100vw / 100) * 1.2)dará como resultado un valor con una unidad devw, no un número entero o una medida en píxeles.Si el problema es que el elemento no se posiciona correctamente, podría haber otros factores en juego, como la posición del contenedor principal, el índice z de los elementos u otras propiedades de CSS que afecten el diseño. Será necesario realizar una depuración y un análisis adicionales para determinar la causa raíz del problema.