Droplist - Arrow styling?

[kaylvigh]

Hello!

I am looking to customize the arrow in the dropdown. I noticed all of the questions asking about this were for RP 9, so I was wondering if anything has changed for RP 10?

I am looking to change the actual arrow icon, and possibly to change the side it is on.

Thank you so much!

[BenHoang_Axure]

Hi!

Droplist widgets inherit the style from the browser and cannot be customized within Axure RP. It’s still possible to customize the styling via code injection but requires more advanced knowledge of HTML or CSS. Just in case, I’ve linked some of the previous discussions about this below:

Droplist (aka pulldown) styling

Is there any way to adjust the location of the caret (down arrow) that appears in a dropdown list? I’ve tried all the styling options possible, but when I run it in Chrome the caret has no padding from the right and just plain looks weird. All assistance very much appreciated. -afinpdx Here’s an image for reference.[droplist]

Styling of Droplists

You want to style the dropdown’s appearance? You could probably hack that in with js injection and I’d love to see how you do that. Personally, I just use a repeater inside a dyn panel set to scroll horizontally for the dropdown options. This won’t use standard HTML controls but it is easier to deal with. For the “closed control” I just use a rectangle with text in it and a caret icon (and possibly another rectangle around the icon depending on what style you want. When you click the rectangle…

Ultimately, if you wish to have a customized arrow icon or styling of these form widgets, then it’s easiest to create the widget manually instead.