Matching a line-tem select to the other selects rendered in the form

Store Design
, , ,

Topic summary

A developer is customizing a product page by adding a custom line item property select field to collect additional data. The issue is a styling inconsistency: the custom dropdown is missing the arrow indicator that appears on the standard variant selects rendered by the form.

Current Status:

  • The developer has shared a screenshot showing the visual difference between the selects
  • Code snippet provided shows a basic <select> element with name="properties[Personalization]" and placeholder option
  • Another community member has responded offering to help and requested the store URL and password for further investigation

Key Question:
How to match the CSS styling of the custom line item select to align with Shopify’s default variant select styling, specifically the dropdown arrow indicator.

Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.
1

Howdy! I am working on a product page and I have added a custom line item to form to collect additional data. The only difference I am seeing is the little arrow on the right side of the dropdowns. I am wonder what I can do to get these styles matching.

Screenshot 2025-03-03 at 12.04.45 PM.png
Screenshot 2025-03-03 at 12.04.45 PM.png378×282 3.48 KB
2

Hi @scribblin ,

Thank you for reaching out to the Shopify community. I’d be glad to assist you. Could you kindly share your store URL and
password (if it’s password-protected) so I can review it and provide you with an update?