ARTICLE AD BOX
Your selectors are wrong, see: mdn selectors Since you are already using classes, your css definitions can use those. Instead of building a kind of path to the element body main .proyectos div, .proyectos > div with the child selector > works. But the div also has a class, which makes it even easier to select with .galería_landing :
.galería_landing { display: grid; grid-template-columns: repeat(11, 1fr); grid-template-rows: repeat(2, 50%); grid-gap: 2%; margin-bottom: 10%; }Selecting the children which should apply the :hover effect can utilyze the child selector:
.galería_landing > article { transition: opacity .3s ease-in-out; -moz-transition: opacity .3s ease-in-out; -webkit-transition: opacity .3s ease-in-out; } .galería_landing > article:hover{ opacity: 0.9; }It's important to define the trasition in the base element without the hovered state, otherwise it will be removed when the hover ends and no transitioning back would be applied.
1 Comment
thank you so much!! I didn't know you could use > like that. this solved it!!!
2025-12-29T19:59:52.913Z+00:00
