¿Puede un selector CSS hacer referencia a otra propiedad de selectores?

Question

Acabo de notar que Webkit ahora tiene algo de soporte con respecto a la especificación CSS Values and Units Module Level. Y me preguntaba si alguien sabe si hay alguna manera de hacer referencia a otra propiedad de selectores de CSS (o estilo DOM) desde un selector de CSS.

Espero que algo así como this sea la respuesta aquí. Lo que sé es muy probable que sea el caso de las implementaciones actuales del navegador; pero por favor siga leyendo ...

Por ejemplo, en el caso en que una animación puede cambiar el tamaño de un elemento (NOTA la sintaxis ${.element2.width} es ficticio):

<style type="text/css"> 
.element1 { 
    .width: /*-webkit-,-o-,-moz-*/calc(80% - ${.element2.width}); 
} 
.element2 { 
    .width: 100px; 
} 
.element2:hover { 
    width: 200px; 
    transition: all 0.4s ease-in-out; 
} 
</style> 

En este caso yo esperaría que el. El ancho de element1 se volverá a evaluar en función de la transición que se desencadenó a partir de los eventos de desplazamiento sobre .element2.

Me doy cuenta de que la especificación antes mencionada. es solo un borrador en funcionamiento, pero tal vez la sintaxis para referirse a dicha 'propiedad de selector referencial' se define dentro de otra especificación. que todavía estoy por descubrir? ¿O simplemente no es un caso de preocupación (gracias a un trabajo pasado por alto)?

Gracias de antemano por tomarse el tiempo para leer, y mucho menos responder a la pregunta.

Answer 1

he añadido una respuesta a la pregunta se conectó: https://stackoverflow.com/a/11071806/137626

• Usted puede utilizar el mismo bloque de declaraciones con la mayor cantidad de selectores como desee, agrupándolos (selectores están separados por comas)
• Puede Reutilice el mismo bloque de declaración más adelante con un selector de CSS diferente sin reescribir todo el bloque de declaración precedido por este selector o utilizando un preprocesador/macro que lo haga por usted. O añadirlo al bloque de declaración existente como anteriormente

ahora con su ejemplo de un elemento cambie el tamaño de CSS en sí: se puede utilizar CSS3 Media Queries y sus @media normas que contienen el mayor número de bloques de declaración como desee. Estas consultas de medios se adaptarían al ancho de la ventana gráfica aquí.
Mezclar elementos en expansión a través de animaciones y consultas de medios que tendrían el efecto contrario muy pronto será muy complicado (y me pregunto con qué contenido está jugando); si quieres Keep It Simple, entonces JS es el camino a seguir. Hay variables, bucles, eventos;) y puede iniciar una animación CSS3 agregando o eliminando una sola clase de un elemento (o cualquier selector de CSS).
CSS3 no reemplazará JS (y no debe usar JS para diseñar HTML ya que JS no está activado o no existe en todas partes y ya existe una buena alternativa llamada CSS).

Answer 2

Aparte de utilizar un precompilador como sass/scss o less, creo que todo lo que puede hacer es esperar o codificarlo.