J’ai juste fait un test rapide et je peux confirmer que les requêtes de conteneur fonctionnent dans les thèmes… une chose que je noterai, c’est qu’il est beaucoup plus difficile de les raisonner que les requêtes média. Quelques-uns d’entre nous dans l’équipe ont été confus par cela au début.
Ce ne sont pas simplement des requêtes média sur des conteneurs, mais elles ont un ensemble distinct d’exigences. Le plus gros problème étant :
La confinement de taille désactive la capacité d’un élément à obtenir des informations de taille à partir de son contenu, ce qui est important pour que les requêtes de conteneur évitent les boucles infinies.
Vous ne pouvez donc pas utiliser une requête de conteneur avec un conteneur qui a une largeur dynamique. Vous devez définir une largeur statique sur le conteneur. Cela limite considérablement ce que vous pourriez espérer en faire, malheureusement.
Voici une preuve de concept vraiment farfelue qui montre qu'ils fonctionnent
@media screen and (min-width: 500px) {
.fk-d-button-tooltip {
width: 300px;
background: green;
container-type: inline-size;
}
}
@media screen and (min-width: 1000px) {
.fk-d-button-tooltip {
width: 500px;
background: yellow;
container-type: inline-size;
}
}
@container (min-width: 400px) {
#create-topic {
background: blue !important;
}
}
Conteneur de moins de 400px :
Conteneur de plus de 400px :
