<table>
    <tr>
        <td>Lorem, ipsum</td>
        <td class="clip">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Molestias est officiis ab autem laudantium! Inventore voluptate dolorum doloribus et magni?</td>
    </tr>
    <tr>
        <td>Lorem, ipsum</td>
        <td class="clip">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Molestias est officiis ab autem laudantium! Inventore voluptate dolorum doloribus et magni?</td>
    </tr>
    <tr>
        <td>Lorem, ipsum</td>
        <td class="clip">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Molestias est officiis ab autem laudantium! Inventore voluptate dolorum doloribus et magni?</td>
    </tr>
</table>
table {
    width: 100%;
    table-layout:fixed;
    
    border-collapse: collapse;
}
td {
    border: 1px solid #000;
}
td:first-child {
    width: 100px;
}
.clip {
    position: relative;

    white-space: nowrap;

    overflow: hidden;
}

.clip::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;

    width: 50px;
    height: 100%;

    background: linear-gradient(to right, transparent, white);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.