How to create a column in CSS the same width as the larger script?

How to create a column in CSS the same width as the larger script?

The text of the ‘same-width’ class must be the same width as the largest writing. If it is not possible to do it in css, please in pure javascript, thank you in advance.

<style>
    .field {display: flex;}
</style>

<fieldset>
    <div class="field">
        <label>
            <span class="same-width">Name</span>
            <input name="nome" placeholder="Energy">
        </label>
        <div class="tooltip">
            <span>?</span>
        </div>
    </div>
    <div class="field">
        <label>
            <span class="same-width">Drop down selection</span>
            <select required="" name="dropdown">
                <option value="">-- please select --</option>
                <option value="o1">Option 1</option>
                <option value="o2">Option 2</option>
                <option value="o3">Option 3</option>
            </select>
        </label>
        <div class="tooltip help">
            <span>?</span>
        </div>
    </div>
    <div class="field">
        <label>
            <span class="same-width">Checkbox</span>
            <span><input type="checkbox">
                I agree</span>
        </label>
    </div>
    </fieldset>