how can we create this one div?

12 Replies
curator
curator16mo ago
just the reactangle with the dropdown
Chris Bolson
Chris Bolson16mo ago
It could be done in several ways. I would probably just add a pseudo element that was a yellow square, rotate it 45 degress and place it in th e middle at the bottom. https://codepen.io/cbolson/pen/VwVXQeq
curator
curator16mo ago
no pseudo elements just with a single div cant use pseudo elements for some reason
Chris Bolson
Chris Bolson16mo ago
you could qchieve it with a clip-path
curator
curator16mo ago
done with it but facing a problem now
curator
curator16mo ago
curator
curator16mo ago
the white background persists!
Chris Bolson
Chris Bolson16mo ago
updated my codepen with a clip-path version
curator
curator16mo ago
hey can we connect for a minute? actually there is one more issue, which is the map which causing him this error if u can
Chris Bolson
Chris Bolson16mo ago
No, sorry. I don’t do chats.
curator
curator16mo ago
actually got the styling resolved but now the animation is not working for some reason sure no worries this was before:
top: 0;
left: 0;

0% {
opacity: .5;
top: 16px;
}

50% {
opacity: .75;
top: -6px;
}
100% {
opacity: 1;
top: 0;
}
top: 0;
left: 0;

0% {
opacity: .5;
top: 16px;
}

50% {
opacity: .75;
top: -6px;
}
100% {
opacity: 1;
top: 0;
}
now it is:
top: 20px !important;
left: -5px !important;
top: 20px !important;
left: -5px !important;
what should be the updated animation?
Chris Bolson
Chris Bolson16mo ago
Can you provide more code? What are you trying to animate and in what way is it "not working"?
Want results from more Discord servers?
Add your server