J'essaie d'ajouter une DIV environnante à une icône dans réagir à l'aide de CSS uni, mais pour une raison quelconque, la DIV ne répondra pas à la taille.
sur la survolte, la couleur de fond change mais je ne peux pas augmenter la taille de la taille de la DIV avec CSS pour une raison quelconque - il reste les mêmes dimensions que l'icône qu'il enveloppe. P>
Voici mon JSX: P>
.showLegendButton {
padding: 50px;
background-color: #ff7979;
:hover {
background-color: #e0e0e0;
cursor: pointer;
}
}
3 Réponses :
Vous pouvez utiliser le rembourrage pour obtenir cet effet surround au lieu de largeur et de hauteur
Merci, mais cela n'a pas pris la taille de la couleur d'arrière-plan plus grande.
Vous devez également ajouter des couleurs d'arrière-plan sur son parent. Vérifiez ma réponse mise à jour
Merci, j'ai mis à jour ma question après avoir implémenté votre solution.
Vous devez ajouter! Important avec la hauteur et la largeur juste quelque chose comme ci-dessous: Ou vous devez donner une hauteur et une largeur indispensables non fixées: Merci
p>
.showLegendButton {
width: 100px !important;
height: 100px !important;
padding-right: 28px;
:hover {
background-color: #ff0000;
cursor: pointer;
}
}
//or
.showLegendButton {
padding: 28px;
:hover {
background-color: #ff0000;
cursor: pointer;
}
}Vous ne déclarez pas dans votre CSS que vous souhaitez modifier les propriétés de la taille sur la survolterie, seule la couleur et le curseur. Déplacez vos déclarations de hauteur et de largeur dans le pseudo-sélecteur comme celui-ci.
.showLegendButton {
padding-right: 28px;
:hover {
background-color: #ff0000;
cursor: pointer;
width: 100px;
height: 100px;
}
}
Vous devez ajouter! Important avec la hauteur et la largeur juste quelque chose comme ici: Largeur: 100px! Important; Hauteur: 100px! Important;
Ce problème ne nécessite pas d'importance. Outre le bon design dans la plupart des cas, peut faire sans importance.
Merci,
! Important n'a pas fonctionnéVous devez donner un rembourrage direct pas la largeur et la hauteur ...
Est-ce que ça sasse? Vous devez l'étiqueter comme tel car c'est invalide CSS.
Hmm, comment ça va? Je l'ai eu d'ici: edwardbeaerzer.com / HOW-to-ADD-Hover-Hover-Events-à-tout-réact-Compon compte
Vous ne pouvez pas nier propriétés dans CSS. Si ce n'est pas Sass, il doit s'agir d'une chose de réaction.