Как обрезать текст в динамической таблице?

//данные
const dataBase = [
    {
      "id": "5c2286fb23e87be312d55d9a",
      "name": {
        "firstName": "Brooks",
        "lastName": "Stone"
      },
      "phone": "+7 (843) 431-2190",
      "about": "Qui aliquip esse occaecat voluptate cillum laborum do adipisicing ea. Lorem dolor pariatur exercitation et Lorem voluptate reprehenderit. Culpa nisi sunt laborum culpa eu et nulla aute aliqua commodo cupidatat culpa. Eu laboris dolor enim officia mollit labore proident proident tempor ex minim magna dolor. Ipsum cillum officia irure amet enim voluptate consequat deserunt laborum nulla excepteur pariatur voluptate incididunt. In excepteur adipisicing dolor ea occaecat elit. Irure dolor quis cillum minim voluptate.",
      "eyeColor": "blue"
    },
    {
      "id": "5c2286fb25005bd0905c04e1",
      "name": {
        "firstName": "Susie",
        "lastName": "Tewman"
      },
      "phone": "+7 (910) 551-3326",
      "about": "Non eiusmod minim ut anim qui non dolore veniam. Lorem veniam nostrud ullamco ad enim commodo incididunt amet ipsum irure. Minim sint tempor incididunt quis. Excepteur commodo mollit elit voluptate reprehenderit eiusmod ex nostrud dolor mollit. Culpa duis pariatur anim sunt in irure ex aliqua.",
      "eyeColor": "red"
    },
    {
      "id": "5c2286fb7f4c26c63eff1b66",
      "name": {
        "firstName": "Armani",
        "lastName": "Armani"
      },
      "phone": "+7 (939) 409-2841",
      "about": "Eu ipsum est in exercitation voluptate occaecat fugiat fugiat ea elit ad veniam adipisicing ullamco. Laboris consectetur enim dolore amet exercitation sit non do reprehenderit non. Proident consequat anim non voluptate non culpa sit occaecat adipisicing. Reprehenderit dolor cillum laboris incididunt exercitation quis esse in ad ut voluptate commodo in. Exercitation veniam adipisicing irure ut qui nulla.",
      "eyeColor": "brown"
    }
 ]
 
 let dbObj = JSON.parse(JSON.stringify(dataBase));
 
 
 function createTable(db) {
    let tableContent = document.getElementById('content');

    let maxTextLen = 50; 

    tableContent.innerHTML = '';

    for(let i=0; i<db.length; i++) {
        let row = `<tr>
                        <td>${db[i].name.firstName}</td>
                        <td>${db[i].name.lastName}</td>
                        <td class="about">${db[i].about}</td>
                        <td>${db[i].eyeColor}</td>
                   </tr>   
                 `
        tableContent.innerHTML += row;
    }
    // alert('Для сортировки колонок таблицы - кликните на соответстующий заголовок');
}
createTable(dbObj);

.about {
   display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin-bottom: 1em;
}

* {
    margin: 0;
    padding: 0;
    vertical-align:top;
}

.container{
    display: flex;

    .table{
        // border: 2px solid #191970;
        width: 50%;
        text-align: center;
        border-collapse: collapse;
        table-layout: fixed;
        display: inline-block;
        // table-layout: fixed;
        
        
        .content{
            text-align: center;
            border: 1px solid black;
            background-color: #F5F5F5;
            height: 200px;
            width: 100%;
        }
        .about{
            background-color: red;
        }
        
        td, th {
            border: 1px solid black;
            width: 25%;
        }
   }

<table class="table" id="table">
            <thead>
                <tr class="info">
                    <th class="header" id="firstName" data-order="des" data-number="0">Имя</th>
                    <th class="header" id="lastName" data-order="des" data-number="1">Фамилия</th>
                    <th class="header" id="about" data-order="des" data-number="2">Описание</th>
                    <th class="header" id="eyeColor" data-order="des" data-number="3">Цвет Глаз</th>
                </tr>
            </thead>
            
    
            <tbody id="content" class="content">
    
            </tbody>
        </table>