Search Box Styling

Resolved bettychandler
(@bettychandler)

9 years, 9 months ago

I am normally pretty good with CSS but I am no expert, I have been having trouble trying to sort out an issue with dropdowns appearing differently such as the ‘select category’ and ‘radius’ dropdowns, the radius is missing the dropdown image but I can seem to get it to work. I am running the Divi theme. http://buyswapsellclassifieds.com.au/

I would also like to change the words ‘Select Options’ on the ‘Category’ dropdown to ‘Choose Category’, is this possible?

Thanks 🙂

Viewing 3 replies - 1 through 3 (of 3 total)

ThemeSumo
(@themesumo)

9 years, 9 months ago
Ignore
- This reply was modified 9 years, 9 months ago by ThemeSumo. Reason: Posted in error
Plugin Author Greg Winiarski
(@gwin)

9 years, 9 months ago
Hi,
1. i am assuming that you are using this code snippet https://github.com/simpliko/wpadverts-snippets/blob/master/search-by-category/search-by-category.php to display the category dropdown, if so then below (or above) line
```
"options_callback" => "adverts_taxonomies",
```
add
```
"empty_option_text" => 'Choose Category',
```
2. i am not sure about your second question, for me both, Category and Radius are displaying with the arrow-down image (although each with different one since multi-select and single-select dropdown fields are rendered differently)?
Thread Starter bettychandler
(@bettychandler)

9 years, 9 months ago
Thanks the fix worked perfectly, after quite a bit of fiddling I managed to fix the other issue by using:
```
.adverts-search .advert-input select {
    cursor:pointer;
    width:100%;
    box-sizing: border-box;
    display: inline-block;
    height: 2.1em;
    font-size: 1.1em;
    background-image: url(".../images/icon-arrow-down.png");
    background-repeat: no-repeat;
    background-position: 98% 50%;   
    font-family: Helvetica;
    -moz-appearance:none;
    -webkit-appearance:none;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    border: 1px solid #ccc;
}
```
- This reply was modified 9 years, 9 months ago by bettychandler. Reason: wording