jquery - 将 JQuery 按钮无空格旋转到 -45 度

Question

我想弄清楚，是否可以将按钮组旋转到 -45 度。我在 JSBin 上做了一个例子.我的问题是旋转按钮之间的空间。知道如何将它们组合在一起吗？

Answer 1

怎么样this ?

除了您的 CSS 代码，我保持一切相同:

.rotate {
  margin: 20px -33px 20px 0 !important;
  height: 24px !important;
  -webkit-transform: rotate(-45deg);
  /* Chrome, Safari 3.1+ */
  -moz-transform: rotate(-45deg);
  /* Firefox 3.5-15 */
  -ms-transform: rotate(-45deg);
  /* IE 9 */
  -o-transform: rotate(-45deg);
  /* Opera 10.50-12.00 */
  transform: rotate(-45deg);
  /* Firefox 16+, IE 10+, Opera 12.10+ */
}

jQuery UI 工作表中的样式会自动在您的按钮上设置边距，因此我在每个按钮的右侧添加了 -33 的边距。我不得不用 !important 覆盖 jQuery UI 样式。如果更改按钮的字体大小等因素，按钮将再次分开，因此我使用 height: 24px !important 来覆盖它。