I’m designing a site for fun. But I have an annoying problem. Probably it is something silly but I m not able get past it.
I’ve created a Div Block with selector name “portfolioInfoContainer”. Then I duplicated it and gave it another selector name so I can distinguish them for different purposes and added “portfolioInfoContainer1”.
So when I go to interaction and try to add something that affects this specific container but I can not see the “portfolioInfoContainer1” in there. You can check the picture.
Problem: you’re trying to target a specific element inside an Interaction, but that only works when element have a unique class affected to them. So if your element had only the first class .portoflioInfoContainer you’d be able to list and select the element.
Solution: the fact is that if you can list and select an class name (element) in the Interaction panel, the interaction will also work on any element that has this class inside a combo class. So what you need to do in order to list and select .portfolioInfoContainer.portfolioInfoContainer1 is to create a new div, anywhere, give it the second class .portfolioInfoContainer1and go to your interaction and try again… the class will now list, you’ll be able to select it, then delete the newly created div. Your interaction will now affect .portfolioInfoContainer.portfolioInfoContainer1.
Worth mentionning, instead of adding a second class, yu could have clicked on the first and “Duplicate” it. By giving a new name and adding some properties, you’d end up with a unique class and the element would have been listed in the interaction panel.