CSS仅适用于Chrome？ [英] CSS that only applies to Chrome?

问题描述

这是我的网站： http://portable-ebook-reader.net

顶部的搜索栏由两个背景图片组成。一个是你输入搜索短语的地方，第二个是要搜索的实际按钮。

The search bar at the top is made up of two background images. One is for where you'd type in the search phrase, the second is the actual button to search.

我的问题是，Chrome中的搜索按钮图片也是2px高。但它看起来完美的IE和FF。如果我修改CSS（margin-top：2px），Chrome看起来不错，但是IE和FF都搞错了。

My problem is that in Chrome the search button image is 2px too HIGH. But it looks perfect in IE and FF. And if I modify the CSS (margin-top: 2px) then Chrome looks good but IE and FF are messed up.

任何想法？我已经找了好几个小时没有运气。

Any ideas? I've been searching for hours without any luck.

谢谢！

推荐答案

首先查找FF。然后让它看起来正确的FF和Chrome。只有你有它看起来正确的FF和Chrome，你应该开始关于自己在IE如何看起来。在你实现这个之后，然后开始调整IE，如果需要，在你的风格规则之前使用 * ，例如： * margin-top：2px; / code>专门调整IE7和IE6的顶部边距。

Get it looking right for FF first. Then get it looking right for both FF and Chrome. Only after you have it looking right in FF and Chrome, should you start concerning yourself with how it looks in IE. After you achieve this, then start adjusting for IE, if necessary, using * before your style rules, example: *margin-top:2px; adjusts the top margin for IE7 and IE6 exclusively.

查看您的代码后，很难准确地说明什么可能导致问题，能够在我的系统上测试不同的解决方案。但这里有一些东西你可以尝试改变你的styles.css文件（位于你的'主题'文件夹中的'chronicle'文件夹），可能会纠正这个问题：

After looking at your code, it's difficult to say exactly what may be causing the problem without being able to test different solutions on my system. But here are some things you can try to change in your styles.css file (located in your 'chronicle' folder within your 'themes' folder) that may correct the issue:

• 将 #s 和 #searchsubmit 设置


• 删除 font：14pxcentury gothic，Arial，Helvetica，sans-serif; 执行上述操作后，如果仍然无法在FF和Chrome中查找，请为<$ p code>


• 设置第一个和第二个填充值 #s 规则设置为 0 （即将 8px 更改为 0px ），然后向 #s 添加 margin-top： $ c>和 #searchsubmit 并给出相同的值，例如 margin-top：8px;


• 如果您仍有问题，请尝试复制此行： font：normal 100％Tahoma，Arial，Helvetica，sans-serif; 从您的 #s 规则集添加到 #searchsubmit 规则集，以便它出现在两个规则集。

• apply the same height value to both your #s and #searchsubmit rule-sets
• remove font: 14px "century gothic", Arial, Helvetica, sans-serif; from #searchsubmit
• after you do the above, if it still doesn't look right in both FF and Chrome, set the first and second padding values for your #s rule-set to 0 (i.e. change 8px to 0px) and then add a margin-top: declaration to both #s and #searchsubmit and give both the same value, for example margin-top:8px;
• if you're still having issues, try copying this line: font: normal 100% "Tahoma", Arial, Helvetica, sans-serif; from your #s rule-set and add it to your #searchsubmit rule-set so that it appears in both rule-sets.

有很多不同的可能性导致问题，这就是为什么你可能想尝试一个上述黑客如果你不能弄清楚问题的根源。

There's so many different possibilities that could be causing the problem, which is why you may want to try one of the aforementioned hacks if you can't figure out the source of the problem.

这篇关于CSS仅适用于Chrome？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！