When adding a Google Custom Search box in your site that uses Zurb Foundation 4, it is most likely that the search button will be distorted and the search box won't have proper padding and you'll see various styling issues.
For a demo of a working zurb + custom search, just visit pesobility.com
The solution is to add this into your CSS:
For a demo of a working zurb + custom search, just visit pesobility.com
The solution is to add this into your CSS:
.gsc-control-cse * { -moz-box-sizing: content-box !important; -webkit-box-sizing: content-box !importantx; box-sizing: content-box !important; } .gsc-control-cse input { box-shadow: none !important; } .gsc-control-cse input:focus { outline: none; } .gsc-control-cse table { border: none; background: transparent; } .gsc-input-box, .gsc-search-box .gsc-input>input, .gsc-input-box-hover { -moz-box-shadow: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; }