tamaño - ¿Cómo calcular porcentajes en MENOS CSS?

texto adaptativo css

Question

Me gustaría calcular el ancho del contenedor hijo (div, etc.) en porcentajes, en función del contenedor principal con LESS CSS .

Estoy usando el forumula por Ethan Marcotte: target / context = result .

Contenedor para padres: 620px
Contenedor infantil: 140px

Estoy usando este cálculo:

div.child-container {
    width: (140/620)*100%;
}

Sin embargo la salida es:

div.child-container {
    width: 0.2258064516129;
}

Me gustaría mover el punto decimal dos dígitos y agregar el%, así:

div.child-container {
    width: 22.58064516129%;
}

Cualquier consejo muy apreciado.

Answer 1

De acuerdo con el sitio web de LESS CSS , necesita cambiar el orden de su ecuación

El resultado es prácticamente lo que espera: LESS entiende la diferencia entre colores y unidades. Si se usa una unidad en una operación, como en:

@var: 1px + 5;

LESS utilizará esa unidad para la salida final: 6 6px en este caso.

Debería ser:

width: 100%*(140/620);

Answer 2

Tal vez la función de percentage no existía cuando OP estaba preguntando, pero para futuras referencias agrego esta respuesta.

div.child-container {
    width: percentage(140/620);
}