Overview
Occasionally, your theme may interfere with Store Locator's styling.
This article outlines how to fix the contents not lining up in Store Locator's header bar.
Setup
- From the Shopify admin, select Online Store.
- Select Actions.
- Select Edit code.
- Under Assets, select your theme's main CSS file.
Note: This will vary by theme and could be something like theme.scss.liquid.
- Copy and paste the following code at the bottom of the file:
.search_bar select, .search_bar input { display: inline !important; }
- Select Save.
Troubleshooting
If the width and padding of the input fields are also affected, adding the following CSS should fix it
.main_search_label { width: auto !important; } .search_bar #within_distance { width: 90px !important; } .search_bar #limit { width: 62px !important; }
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article