html - IE竖排文本问题

标签 html css internet-explorer rotation

我目前有一个反馈选项卡,固定在浏览器右侧并旋转 90 度。该选项卡在 Firefox 和 Chrome 中看起来不错,但在 IE 中,框会旋转,但文本不会旋转。它是一个非常简单的按钮,并且可能有一个我只是缺少的非常简单的解决方案。

    #feedback{
  color:#FFF;
  position:fixed;
  bottom:200px; right:-56px;
  width:140px; 
  height:35px; 
  line-height:40px;
  background:#727948;
  text-align:center;
  font-size:18px;
  border-bottom-left-radius:5px;
  border-bottom-right-radius:5px;
  -webkit-box-shadow: 0 8px 6px -6px black;
     -moz-box-shadow: 0 8px 6px -6px black;
          box-shadow: 0 8px 6px -6px black;
  opacity:0.8;
  -webkit-transform: rotate(90deg);/* Safari and Chrome */
  -moz-transform: rotate(90deg); /* Firefox */
  -ms-transform: rotate(90deg); /* ie9 */
  -o-transform: rotate(90deg); /* Opera */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); /* ie8 */
  writing-mode:tb-rl; /* ie8 */ 
}

#feedback:hover{
  opacity:1;
}

https://jsfiddle.net/nhf5m4y1/

最佳答案

writing-mode:tb-rl 已弃用,您应该使用 writing-mode:vertical-rl 代替。

关于html - IE竖排文本问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30922956/

相关文章:

jquery - 元素未由附加事件处理程序触发

javascript - canvas.getContext ('2d' );错误

javascript - 具有三个 div 的响应栏

internet-explorer - IE9 会支持 HTML5 File API 吗?

javascript - IE 中数据属性长度的限制?

javascript - Internet Explorer 复古兼容性

html - 在没有 javascript 或 jquery 帮助的情况下在选择选项标签中创建 href 链接

javascript - 需要 Javascript 显示两个隐藏的 css div

HTML/CSS - 在不使用 javascript 的情况下动态调整 iframe 的大小

javascript - CSS 网格。我当前的布局在 chrome 上按预期工作但在 firefox 上不工作