Default search box invisible on small device?

[elecabunaser]

Hello there,

    <div id="search"></div>

I just set it from my algolia app. how can i override CSS for this input?

I’m working also responsiveness for this web app, but when set it small device search box will be invisible otherwise it is visible so i provide pictures (please follow width) to understand better. its like, if min-width:680+ it will be visible otherwise not visible in display.

Any solution for this?

Thanks

[chuck.meyer]

Hi @elecabunaser,

If you’re using our InstantSearch front end libraries, the styles all follow a standard naming convention of ais-[WidgetName]-[element]--[modifier] as documented here:

Customize a React InstantSearch widget | Algolia

I’m not sure why you’re losing the background color on small devices, but I would start by taking a look at the CSS your importing (most of our users import the satellite.css styles mentioned on that page).

[elecabunaser]

Hi Chuck,
I’m using tailwind CSS on that page, have a look my code…