css - 如何在其父 div 中对齐/调整 css 旋转跨度

Question

如何在紫色 div 中间获得“反馈”跨度爆炸？

http://jsfiddle.net/XcWHr/

我在这些主题上尝试了一些变体：https ://developer.mozilla.org/en-US/docs/CSS/transform-origin?redirectlocale=en-US&redirectslug=CSS%2F-moz-transform-origin

比特不能完全击中头部......

Answer 1

我认为在这种情况下，旋转紫色 div 而不是反馈跨度会更容易。这样，您就可以将水平和垂直居中与旋转分开进行推理。这可行吗？我已经更新了你的 jsfiddle：http: //jsfiddle.net/XcWHr/2/

我将您的“反馈”跨度设置为以常规方式居中并反转容器的宽度和高度：

.feedbackTab 
{
    height: 42px; 
    width: 156px;
    text-align: center;
    line-height: 42px;
}

然后我将“反馈”跨度设置display: inline-block为尊重其容器上的居中规则。最后，我将您的.rotate课程放在容器上，而不是“反馈”范围内。