Médias Comportement similaire à une requête sur la largeur d'un div spécifique

Question

Je crée un éditeur dans lequel le contenu d'un article est chargé dans une div, et les sélecteurs jQuery me permettent d'éditer le contenu en ligne. J'ai juste rencontré un petit obstacle en essayant d'ajouter une certaine réactivité au style des modèles: dans mes feuilles de style de modèle, j'utilise un identifiant spécifique de la zone de prévisualisation pour spécifier où le style devrait s'appliquer . J'applique le même identifiant à l'étiquette du corps de l'affichage de la publication afin que l'aperçu dans l'éditeur et la vue complète de la publication se ressemblent. Je mettais quelques requêtes média du côté de la vue et je me suis rendu compte que sur la page d'aperçu, quelque chose comme @media screen and (max-width: 640px) se comporterait différemment car l'aperçu ne prend pas toute la largeur de l'écran.

Y at-il un moyen que je peux utiliser un sélecteur de requête média autre que la largeur de l'écran, mais à la place de la largeur d'un élément .. ou quelque chose d'équivalent? Ou pourrait-il y avoir une autre façon de mimer ce comportement tout simplement avec javascript ..

Answer 1

Malheureusement, il n'existe actuellement aucun moyen pour une requête multimédia de cibler une div. Les requêtes médias ne peuvent cibler que l'écran, c'est-à-dire la fenêtre du navigateur, l'écran de l'appareil mobile, l'écran du téléviseur, etc ...

Answer 2

Pour l'instant j'utilise:

.preview { 
    zoom: .8; 
    -moz-transform: scale(0.8);} 

lorsque la div .preview est de 80% de la largeur de la page. Il fonctionne généralement, mais avec quelques problèmes, et il n'est pas entièrement flexible puisque les divs en question ne seront pas toujours définis en% de la largeur de la page.