CSS3在IE8中旋转

时间:2013-12-04 21:24:01

标签: javascript jquery internet-explorer css3 twitter-bootstrap

我在stackoverflow上尝试了所有可能的选项,以帮助IE8 转换:旋转。 唯一正常工作的是 cssSandpaper 。 它根据需要旋转我的导航,但是当我在IETester中测试它时,似乎真实链接与地平线成反比角度,与导航相比。

这是print-screen

我现在花了很多时间,寻找解决这个原因的原因。 希望有专业人士可以告诉我这是什么问题。

JsFiddle

nav的代码是简单的bootstrap:

<nav class="navbar navbar-default navbar-fixed-top">
    <div class="container">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
      </div>
      <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav">
          <li><a href="#">123</a></li>
          <li><a href="#">123</a></li>
          <li><a href="#">123</a></li>
          <li><a href="#">123</a></li>
          <li><a href="#">123</a></li>
          <li><a class="lastNavLink" href="#">123</a></li>   
        </ul>
      </div><!--/.nav-collapse -->
    </div>
  </nav>
</header>

在css中旋转

nav    {
      margin-top: 40px;
      margin-bottom: 20px;
      -moz-transform: rotate(-4deg);  /* FF3.5+ */
      -o-transform: rotate(-4deg);  /* Opera 10.5 */
      -webkit-transform: rotate(-4deg);  /* Saf3.1+, Chrome */
      -ms-transform: rotate(-4deg);  /* IE9 */
      transform: rotate(-4deg);  
      -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9975640502598243, M12=0.06975647374412515, M21=-0.06975647374412515, M22=0.9975640502598243, SizingMethod='auto expand')";
      zoom: 1;
    }

Javascripts默认为bootstrap + cssSandpaper 。 在代码之前看看jsFiddle。

0 个答案:

没有答案