<calc-size>
An experimental function that allows performing math on 'intrinsic' sizes like 'auto', 'min-content', or 'fit-content'. This is a key part of making it possible to animate from 'height: 0' to 'height: auto'.
This is an experimental technology. The syntax and behavior are still subject to change.
Syntax
/* Usage Example */
.accordion-content {
/* Experimental: allows math on ';auto' height */
height: calc-size(auto, size);
transition: height 0.3s ease;
}<calc-size> Browser support
Limited availability
Since
2020 70% global usage
This feature is not Baseline because it does not work in some of the most widely-used browsers.
129+
129+
Your first month is free
Managed WordPress hosting for faster sites.
Learn more