css-calc

CSS Calc alternative

由 拟墨画扇 提交于 2019-11-26 05:57:31
问题 I am trying to dynamicly change the width of a div using CSS and no jquery. The following code will work in the following browsers: http://caniuse.com/calc /* Firefox */ width: -moz-calc(100% - 500px); /* WebKit */ width: -webkit-calc(100% - 500px); /* Opera */ width: -o-calc(100% - 500px); /* Standard */ width: calc(100% - 500px); I want also support IE 5.5 and higher , i found the following: expression. Is this the correct usage: /* IE-OLD */ width: expression(100% - 500px); Can I also

Disable LESS-CSS Overwriting calc() [duplicate]

由 元气小坏坏 提交于 2019-11-26 05:42:34
This question already has an answer here: Less aggressive compilation with CSS3 calc 4 answers Right Now I'm trying to do this in CSS3 in my LESS code: width: calc(100% - 200px); However, when LESS compiles it is outputting this: width: calc(-100%); Is there a way to tell LESS not to compile it in that manner and to output it normally? Using an escaped string (a.k.a. escaped value): width: ~"calc(100% - 200px)"; Also, in case you need to mix Less math with escaped strings: width: calc(~"100% - 15rem +" (10px+5px) ~"+ 2em"); Compiles to: width: calc(100% - 15rem + 15px + 2em); This works as

Using calc() with tables

由 拥有回忆 提交于 2019-11-26 04:56:57
问题 I\'m trying to get a table with fixed-width td s and variable-width td s. Im using the CSS calc() function, but somehow it seems like I can\'t use % in tables. So that is what I have so far: <table border=\"0\" style=\"width:100%;border-collapse:collapse;\"> <tr style=\"width:100%\"> <td style=\"width:30px;\">1</td> <!--Fixed width--> <td style=\"width: calc( (100% - 230px) / 100 * 40);\">Title</td> <!--Width should be 40% of the remaining space--> <td style=\"width: calc( (100% - 230px) /

Less aggressive compilation with CSS3 calc

由 五迷三道 提交于 2019-11-25 22:41:49
问题 The Less compilers that I\'m using (OrangeBits and dotless 1.3.0.5) are aggressively translating body { width: calc(100% - 250px - 1.5em); } into body { width: calc(-151.5%); } Which is obviously not desired. I\'m wondering if there is a way to signal to the Less compiler to essentially ignore the attribute during compilation. I\'ve searched through the Less documentation and both compilers\' documentation, and I could not find anything. Does Less or a Less compiler support this? If not, is
订阅 css-calc