Value calculation for CSS

Question

As a web developer you often run into problems that might be solved very easily if there was something like value calculation.

I\'ve often wondered why it is not pos

Answer 1

You Can Use SASS and LESS . if you don't know anything about them , Google them :

Answer 2

You might be interested in languages that compile to CSS, such as SASS, LESS or Stylus.

Answer 3

I'd say it is because CSS just defines how something is displayed by the browser. There is no flow of information back to the style sheets, or to say it in other words: CSS is not dynamic.

If you know the height of an element and want to change it everytime the page is displayed you can generate a style sheet with PHP or other languages. Then you also know what's the half of the height and can set it also.

If you don't know the height it would be a dynamic change. The browser would have to render the page at first, then determine the height of the element and send it back to CSS. There the line-height is computed and altered in the rendered page. But maybe therefore the overall height of the element changes , too. Now the browser had to go back to CSS again and so on...

Just would not work. CSS is there to define the look of the page statically.

Answer 4

CSS3.1 defines calc() - it does exactly what you ask for. http://www.w3.org/TR/css3-values/#calc

Answer 5

Why is it "out of question for normal websites"? jQuery can do a lot of this fairly easily...

IE does support calculations in styles, but it is not recommended, performs like a dog, and is completely incompatible with everything else.

Answer 6

There has been development on this. Still not 100% ready but it is interesting. I hope this helps anybody coming to this page in the future!

https://developer.mozilla.org/en-US/docs/CSS/calc