1

I'm doing a fairly straight forward css'rule

#content {
 height: ~'calc(100% - 65px)';
}

But it breaks the browser in IE10, literally makes it stop working and demands reboot/refresh. Although this works perfectly in IE9/IE11, Chrome and Firefox that I've tried it in. I'm also using the ~'' to escape the expression so LESS won't remove the spaces.

Does anyone know why this breaks my browser? And also how come it work in IE9 & IE11 and specifically not IE10?

  • 1
    What is the purpose of "~" ? – Jon Snow Jul 25 '14 at 17:56
  • @JonSnow It's for escaping the string so the compiler in LESS won't render it beforehand, if I understood it correctly. If I'm not using it an expression like calc(100% - 50px) will become calc(50%). edit: found this link [link](https://github.com/SomMeri/less4j/wiki/Less-Language-Escaping) – Markus Waltre Jul 25 '14 at 18:00
  • Did you check this, [http://stackoverflow.com/questions/16658482/css-calc-function-bug-in-ie][1] [1]: http://stackoverflow.com/questions/16658482/css-calc-function-bug-in-ie – Ashish Balchandani Jul 25 '14 at 18:03
  • Have you tried just using it as vanilla CSS, maybe LESS is doing something strange to it anyway? – Jon Snow Jul 25 '14 at 18:09

1 Answers1

0

Cant you just use instead ?

  <style>
   .central > div {display:inline;}
   .one {width:65px;}
   .two {width:100%;}
  </style>

<div class="central">
 <div class="one"></div><div class="two"></div>
</div>
Fappie.
  • 482
  • 6
  • 18