for example, in a drop down menu, I need to show current price option on top, with a drop-down menu shows below when clicked. Currency symbols may vary, eg: $ 100 or £100, but the symbol is not changed by selecting the drop down list. 2 types of drop down list:

Style 1 (repeat currency symbol):

enter image description here

Style 2 (price only):

enter image description here

which one should I use?

4 Answers 4


Since I cannot see the harm in putting the currency symbol on all the values I would suggest the first option. It might help save an error if you have more than one drop-down with another currency.

Can you think of any reason why you wouldn't?


Keep the items in the list consistent, whether with the currency symbol, or without. This makes it easier to use and should also be slightly easier to code (no if iteration = first { write ccy-code } construct required.

If the items always have the same currency, you could add the currency symbol as a prefix to the dropdown, as Bootstrap does with Input Groups.


From a usability point of view I would say no as it's not needed unless the currency is changing in the same list, just put it at the top. Saves repeating yourself as well, depending on your code


I would go with the top one but I would put the $ symbol closer to the amount. What is a bit off about it being so far away is that it looks like it could be something else.


$ 10
$ 20
$ 50
$ 100
$ 150
$ 200

Also depending on your use case it might be worth looking at donation sites to see what they are doing. My two favourites here are Kickstarter and Global Giving

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.