css - 在 FireFox 29.0.1 中不工作 css calc()

Question

 <style>
    .mapstyle {
          height: 100%;
          height: -webkit-calc(100% - 60px);
          height: -moz-calc(100% - 60px);
          height: calc(100% - 60px);
          margin-left: 300px;
     }
 </style>

<div style="margin:0 auto; position:relative; text-align: left; width: 100%;">
 <div style"width:100%;"><h1>HEADER</h1></div>
 <div style="width: 300px; position: absolute; top: 100px; left: 0;">test</div>
 <div id="map" class="mapstyle">
      <script>....
              var map = L.map('map').setView([57.3, 29.4],).setMaxBounds(bounds);
              ...//Leafletjs.com
      </script>
 </div>
</div>

css 中的函数 calc() 在 firefox 29.0.1 中不工作，其他浏览器可以工作。

Answer 1

改变第一个div

position:absolute; height:100%

http://jsfiddle.net/Dxn5d/2/