![8 ways to use AI in digital marketing [+ examples]](https://i1.wp.com/www.hubspot.com/hubfs/Google%20Drive%20Integration/ai%20marketing_32023-4.png?w=400&resize=400,250&ssl=1 "8 ways to use AI in digital marketing [+ examples]")
The Selectmenu Element Is No More…Long Live Select!
I was looking over an older article Patrick Brosset penned for us introducing . From there, I clicked the linked-up
OK, link rot is a thing and happens all the time. Perhaps the site needs a little URL designing? But no, it’s not that at all. I searched a bit and found Jared White’s post saying that
I’m only sharing the links for now but plan to spend some time with it and jot down notes on Open UI’s new page for the Customizable . I enjoyed looking at the boilerplate from Adam’s demo as a first glance:
select {
&, &::picker(select) {
appearance: base-select;
}
&::picker(select) {
transition:
display allow-discrete 1s,
opacity 1s,
overlay 1s allow-discrete
;
}
&:not(:open)::picker(select) {
opacity: 0;
}
&:open::picker(select) {
opacity: 1;
@starting-style {
opacity: 0;
}
}
}I see the ::picker(select) there that’s driving all of it. If I sneak a peek at Una’s post, I see that there are more ways to select different parts, including:
(which now accepts HTML in between the tags!)option::beforeoption:checked(a little confusion here with the selected option)
(the little chevron arrow marker thingy)
So, perhaps Chrome is more of a fan of extending the native with additional CSS features for selecting the existing parts rather than moving forward with a completely new element. That’s cool, as one of Una’s demos shows how we still get the default behavior even if a browser does not support the new selectors.
