所有浏览器中具有相同行高的按钮

发布于 2024-12-09 08:29:28 字数 379 浏览 0 评论 0原文

我一直在寻找答案,但不幸的是仍然没有找到正确的答案。

我正在使用图像创建按钮,并且按钮本身在所有浏览器中看起来都很好。

问题是文本的放置方式不同(垂直)取决于您从哪个浏览器查看它。我尝试过应用行高、填充/边距、顶部/底部和其他几个属性,但没有成功。

是否有一种方法(使用 CSS)在所有浏览器中正确放置文本? (Opera、Firefox、Chrome、Safari)...不用担心 Internet Explorer - 我将为此应用一些特殊的 CSS!

我在这里举了一个例子来玩: http://jsfiddle.net/GydjP/1/< /a>

I've been searching for answers, but unfortunately still havn't found one the right one..

I'm creating buttons using images and the button itself looks good in ALL browsers..

The thing is though that the text is placed differently (vertically) depending on which browser you are viewing it from. I've tried applying both line-height, padding/margin, top/bottom and several other attributes, but without success..

Isn't there a way (with CSS) to place the text correctly in all browsers? (Opera, Firefox, Chrome, Safari)... Don't worry about Internet Explorer - I'll apply some speciel CSS for this!

I've put up an example here to play around with: http://jsfiddle.net/GydjP/1/

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

弥枳 2024-12-16 08:29:28

Button::-moz-focus-inner {border:0;padding:0;margin:0;}

并向按钮添加行高显然是迄今为止我能为按钮找到的最佳解决方案..它不适用于不过 Firefox + Chrome 的版本非常旧

button::-moz-focus-inner {border:0;padding:0;margin:0;}

and adding Line-height to the buttons is apparently the best solution I can find for my buttons so far.. It doesnt work in very old versions of Firefox + Chrome though

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文