2013-10-25 133 views
1

我试图让我的提示div的&他们1px的绿色边框:&前:箭头后,基于Paulie-D's tooltips with a 2px border.跨浏览器1px工具提示箭头与CSS边界?

我可以让他们在一个浏览器工作在同一时间:如果他们在Chrome工作,他们在Firefox中只有1px。如果他们在Firefox中工作,他们在Safari中只有1px。如果他们在Safari中工作,他们在Chrome中只有1px。等甚至没有用IE浏览器测试过。

Here's my attempt, in Codepen

任何人都可以帮忙吗?是否有可能获得一致的跨浏览器结果,或者我最好放弃和使用背景图像?

+0

这是相当困难得到这个完全正确(这是我使用了我在做演示的数字的原因之一)。如果仔细观察,我的版本中的边界不太正确(左/右箭头)。由于边框倾斜,所以会出现一些子像素问题和别名。坦率地说,我不会担心太多,并不是说真正的人们实际上拥有多个浏览器。 –

回答

2

你尝试一台发电机?这是一个我用的,我没有注意到,跨浏览器的问题:http://cssarrowplease.com/

通过该工具生成的CSS比你的不同。可能你可以试试看。