web-dev-qa-db-fra.com

Suppression de la propriété héritée d'un élément (box-sizing)

J'utilise un plugin lightbox jQuery sur un site bootstrap. Il a box-sizing: border-box réglé via le sélecteur universel.

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

La div lightbox n'apparaît pas correctement à cause de cela (parfois une barre de défilement verticale apparaît). Une fois que nous avons supprimé cela via l'inspecteur Web, cela semble correct. Existe-t-il un moyen de supprimer la propriété de dimensionnement de boîte de cet élément particulier. box-sizing:'' ou box-sizing:none ne semble pas fonctionner.

csscss3twitter-bootstraplightbox
30
Gokul Kav

Le box-sizingmsdn , mdn La propriété CSS par défaut est box-sizing: content-box;. Avez-vous essayé de l'utiliser pour remplacer le style hérité?

50
VKen

vous pouvez utiliser

*:not(.classname){
  box-sizing : border-box;
}

classname sera la classe d'élément que vous souhaitez exclure du sélecteur universel.

7
user5371360

J'ai eu un problème similaire avec bootstrap et j'ai remplacé la propriété CSS de dimensionnement de boîte pour <a> comme ça,

a *,
a *:before,
a *:after {
    -webkit-box-sizing: content-box !important;
    -moz-box-sizing: content-box !important;
    box-sizing: content-box !important;
}

Personnalisez-le selon vos besoins.

4
Karthik P