Overriding Search Form CSS

  • depiction

    (@depiction)


    10 years, 11 months ago

    Hi,

    I placed the search form widget into a sidebar and it works great overall. The thing I hate most about this plugin is that !important is used in the jqueryautocomplete.css file, making it impossible to style without updating the file in the plugin folder. Can you please stop using !important so people can override styling in their theme’s CSS file?

    Lastly, the search results drop-down should be positioned absolutely from the search form, not the entire page. It looks like it also assumes a fixed size for the search form. Because of this and the fact that I increased the padding on the search form, the results box covers up a bit of the search form. Is there a way to fix this?

    Matt

    http://wordpress.org/extend/plugins/woocommerce-predictive-search/

Viewing 1 replies (of 1 total)
  • antekdesign

    (@antekdesign)

    10 years, 5 months ago

    Hi Matt / Depiction,

    Not sure if you still have problems with this but, if you give an id to a parent element of the search form (e.g your theme name), you add this id before the plugin css classes in your stylesheet, and use “!important”, you should be able to override the plugins styles without having to touch “jqueryautocomplete.css”.

    e.g.
    #your-id .predictive_results {border: 1px solid #ccc !important;}

    For the search results drop-down, you can do the same thing and centre it to the search form this way it will look a tiny bit better.

    Antonio

Viewing 1 replies (of 1 total)
  • The topic ‘Overriding Search Form CSS’ is closed to new replies.