huge magnifying glass

The magnifying glass image is a SVG image (Scalable Vector Graphic). SVGs have no intrinsic width or height as they can scale to be any size. Some browsers will simply keep scaling the image up until it can’t any more (this is the issue you are experiencing). OSD Blog Search comes without CSS but the issue can be simply remedied with the following.

#osd-search-submit {
display: inline-block;
width: 25px;
height: 25px;
}

As this is not really a support question and more of a styling question. You might find stackoverflow.com or many other similar sites to be more helpful and faster to reply.

I hope this information was helpful. Good ratings are always appreciated.

Thank you – worked great, but the mag glass is still returning to next line. Am using 1/3 right column: https://gavekalcapital.com/CMS/blog – maybe I need to shorten the length of the submit text field – will see if I can find a solution at stackoverflow.com – unless you’ve got some CSS you’re aware of!

jp

Hi, I have same problem with a huge magnifying glass under the search box. Where should I place that code? Thanks

In your theme’s style sheet would be best.

I wound up changing themes to access better search icon magnifying glass, then used this code to style it:

The top setting is for the text and the bottom is the button.
.widget.widget_search form input[type=”text”] {
background-color: #333;
}

.widget.widget_search form input[type=”submit”] {
background-color: #333;
}

Awesome! Excelent plugin. Exactlly what I was looking for ??

Thanks, osdwebdev.