2 replies [Last post]
petitedecadence
petitedecadence's picture
Offline
newbie
Last seen: 7 years 19 weeks ago
Timezone: GMT-6
Joined: 2015-01-08
Posts: 2
Points: 5

Hi!

I have a wordpress site running woocommerce but I have a small problem with my product search box; for purposes of solving the issue I've placed on top of this product search box the global website search form, which has proper styling. The problem with the product search is I can't get the borders and button (magnifying glass) to look exactly the same as the global search form, because the borders are declared as 0 in the styling. I've attached a screenshot of what the code looks like, both in CSS and in HTML in firebug for both search forms. For some reason, the product search doesn't inherit my theme's styling as the global search.

I've tried to override the 0px border in my custom stylesheet, but I can't get it to work..I also don't understand the HTML code for the global search form (the properly styled one), but I'm assuming that's what's giving it it's style as opposed to css, because it changes according to it's placement. (I'm referring to this bit:)

<input type="text" onblur="if (this.value == '')this.value = 'Introduzca la palabra clave';" onfocus="if (this.value == 'Introduzca la palabra clave')this.value = '';" value="Introduzca la palabra clave" id="s" name="s">

Here is a link to my page: https://wolfrikdesign.com

If anyone could help out in making these two search forms look the same I'd be incredibly grateful!!
Laughing out loud

Thanks in advance,
Mariana

AttachmentSize
screenshot2.jpg154.85 KB
scrrenshot1.jpg43.75 KB
Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 4 days 20 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

Hi petitedecadence, The

Hi petitedecadence,
The border is actuly on a div containing the input with a class of searcharea.
So just wrap the field in a div with class="searcharea" and all should fall into place.

petitedecadence
petitedecadence's picture
Offline
newbie
Last seen: 7 years 19 weeks ago
Timezone: GMT-6
Joined: 2015-01-08
Posts: 2
Points: 5

Worked like a charm

Hi Tony!

Thanks so much, that worked perfectly! I also added the searchbutton class to the submit button and now it looks exactly the same Smile

Thanks!!