0

我试图将一个按钮(带有)CSS3 样式(渐变)旋转 90 度并将其应用到绝对正确的位置:0px 位置。那个按钮是“关于我们”。

好像有2个问题。首先是按钮元素并没有一直向右(就像我想要的那样),而且似乎问题在于 CSS3 旋转仍然认为 150px 宽度。如果我禁用旋转,则元素会完美地与右侧屏幕对齐,不会留下任何空间。

我还发现在 Google Chrome 中,当我将鼠标悬停在“Kaj točno delam”按钮上时,它没有正确应用渐变 - 这意味着在渐变开始之前按钮上有 1px(或 2)的黑色空间(从左到对) - 但是,当处于正常(水平)模式或向右转动(当我测试时)时,这不会发生。这也很奇怪,因为在使用 Chrome 开发人员工具来移动元素时,它并没有显示得那么大:悬停。

使用 Internet Explorer 时,“关于我们”的垂直按钮仅在将其按在顶部时才有效(其他任何地方都没有)。

所有这些问题都是因为 CSS3/HTML 错误而发生的吗?

在不使用图像的情况下,有没有更好的解决方案?- 也许使用 jQuery 或其他东西?

谢谢您的帮助。

4

1 回答 1

0

如果旋转元素,宽度保持不变。你需要像这样计算你的正确位置:

-(width/2-height/2) = -(150/2-27/2) = -61,5

所以你需要right: -61,5px; 代替right: 0;

于 2012-08-13T09:10:51.173 回答