Площадь внутри ширины

Question

У меня есть стол с span элемент в th. Я хочу ширина пролета, чтобы соответствовать й, но на самом деле он заполняет всю строку :(

Мой код:.

for (var i = 0; i < testInfoFieldsNames.length; i++) { 
     title = testInfoFieldsNames[i].toLowerCase(); 

     th = $('<th></th>'); 
     span = $('<span></span>').addClass('cell-container').text(title); 
     th.append(span); 
    } 

    tableHeader.append(th); 

CSS:

.cell-container { 
    position: absolute; 
    display: block; 
    top: 5px; 
    left: 0; 
    width: 100%; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
    overflow: hidden; 
} 

Как я могу установить ширину диапазона для заполнения й только?

Answer 1

я думаю, вы должны дать го стиля, как:

th{ 
    position:relative; 
} 

Answer 2

Пожалуйста, попробуйте это я думаю, что это будет работать для вас.

пожалуйста, проверьте этот пример link

for (var i = 0; i < testInfoFieldsNames.length; i++) { 
     title = testInfoFieldsNames[i].toLowerCase(); 

     th = $('<th><span class="cell-container">'+title+'</span></th>'); 
    } 

    tableHeader.append(th); 

CSS

span.cell-container { 
    display: block; 
    top: 5px; 
    left: 0; 
    width: 100%; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
    overflow: hidden; 
} 

Answer 3

'пядь' Tag является встроенный элемент. Он не имеет ширины и высоты. Вы должны использовать «DIV» или установить следующее свойство

display:block;