My codes in Vue, creates a tree where each node looks like:

As you can see, it's creates those dots at the end because I use white-space: nowrap;. I pass the component the whole data from the parent component. I want to be able to add a field which represents the maximum number of chars in all nodes (for example if one have name of "abc" and other have "abcd" so it will pass the value 4). I want to set the length of all the nodes, based on that value. The font size is 12px and the block CSS looks like:

.orgchart .node .title {
    transform: rotate(-90deg) translate(-40px, -40px) rotateY(180deg);
    transform-origin: bottom center;
    width: 120px;
}

As you can see, it's currently 120px. How can I replace this value with a calculated value? In other words, given the maximum value, how can I calculate width?