CSS - Can I use an object's Width in Calc()?

Question

I want something like this:

height: calc(width + 5px);

This is just a small example but I'm ultimately looking for a way to use the set width as a part of the calculation, not a simpler way to solve the example. Any searches I do just gives examples on how to use calc() to set the width. Thanks!

Answer 1

The closest you might be able to come with pure CSS is combining CSS variables with calc

:root {
	--width: 100px;
}
div {
	border: 1px solid red;
	height: calc(var(--width) + 5px);
	width: var(--width);
}

<div>
test
</div>

This will let you define a CSS variable --width and use it to calculate a new height for the div.