width should be left to 100%

Nobody has claimed this yet.

**mapbox-gl-js version**:
v1.11.0

**browser**: Chrome

### Steps to Trigger Behavior

https://docs.mapbox.com/mapbox-gl-js/example/mapbox-gl-geocoder-outside-the-map/

Remove the hacks on the page (geocoder class position absolute...) and try to make the text input 100% width.
This class prevents it:
```
@media screen and (min-width: 640px)
.mapboxgl-ctrl-geocoder {
width: 33.3333%;
font-size: 15px;
line-height: 20px;
max-width: 360px;
}
```
That page even has a hack to fix this:
```
.mapboxgl-ctrl-geocoder {
min-width: 100%;
}
```

Please remove both width styles from ```mapboxgl-ctrl-geocoder``` and let us style it like any html, so it fits it's container size by default.

### Expected Behavior

100% width by default on all screen sizes. Developers can add containers as they wish.

### Actual Behavior

Start with the linked Mapbox GL JS geocoder example and search the geocoder control styles for .mapboxgl-ctrl-geocoder, especially the media-query width rules shown in the issue. Remove the conflicting default width styles and verify that the control fills its container at all screen sizes without the example's workaround.

Written by the indexing model from the issue text.