Javascript 谷歌CSE-搜索栏太大了

我的老板想让我把谷歌的CSE应用到我们的网站上。到目前为止，我已经成功地将它集成到我们的测试站点上，并且在通过Firefox查看站点时，它会正确地显示出来。

但是，在Chrome中查看时，相同的搜索栏会在标题上延伸。

显然，在解决此问题之前，我们无法在实时站点上实施此更改。为此，我使用了谷歌的CSE工具，它生成了以下代码

(function() {
    var cx = 'custom site ID here';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//cse.google.com/cse.js?cx=' + cx;
    s.parentNode.insertBefore(gcse, s);
})();

这是由脚本标记所包围的，脚本标记包含在代码中，还有一个用于CSS样式的div标记，在旧的搜索栏中。我该怎么做才能让这个搜索栏在Firefox和Chrome上正常工作？我已经查看了div标记的CSS，唯一的内容是position:relative和float:right

---

编辑：我已经使用了div标签的CSS，将宽度设置为230像素。这是可行的，但这似乎是一个不太理想的解决方案，可能无法在低分辨率显示器上运行。有没有办法使其更通用？

您可以研究使用

em

或

%

来根据父元素或浏览器设置大小。您可以研究使用

em

或

%

来根据父元素或浏览器设置大小。