解决css3文本旋转的错误

Question

查看问题链接:

http://www.dev.pingag.ch/allsystems/fileadmin/templates/diagramm.html

我用html和css创建了这个图表。每个单词(integrität, innovation等)周围都有一个div，一个div代表所有内容。

"kompetenz"one_answers"kunden"的文字被旋转为:

    **-webkit-transform:rotate(-90deg);
-moz-transform:rotate(-90deg);
-o-transform: rotate(-90deg);**

适用于Mozilla, Chrom和Opera。

对于Internet explorer，我使用:

写入方式:tb-rl;

旋转文本。

这个结果在ie浏览器中是完美的，但是在Mozilla, Chrom和Opera 中一个不需要的白色边框出现在顶部和底部

你知道我该如何解决这个问题吗?

thank you in advance

Answer 1

为什么不直接改变div的宽度呢左边和右边分别为98px -> 100px右上和右下各加3-4px