// IE10까지 호환
<style>
    .flex {
        display: flex;
    }
    .flex-item-first {
        overflow: hidden;
        flex: 1 1 auto;
    }
    .flex-item-second {
        flex: 0 0 auto;
    }
    .flex-type2 {
        display: flex;
        flex-direction: column;
    }
    .flex-inner-first {
        overflow: hidden;
        display: block;
        flex: 0 1 auto;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .flex-inner-second {
        display: block;
        flex: 0 0 auto;
    }
</style>
        
<div class="flex">
    <div class="flex-item-first">
        <div class="flex-type2">
            <div class="flex-inner-first">첫번째첫번째 첫번째첫번째 첫번째첫번째 첫번째첫번째 첫번째첫번째 첫번째첫번째 첫번째첫번째 첫번째첫번째 </div>
            <div class="flex-inner-second">두번째두번째두번째 두번째두번째두번째 두번째두번째두번째 두번째두번째두번째 </div>
        </div>
    </div>
    <span class="flex-item-second">세번째세번째</span>
</div>