начальной загрузки таблица реагирующей не работает - ширина проблема

Question

У меня есть проблемы с именами, которые слишком долго, чтобы поместиться в колонке, это выглядит следующим образом:

http://i.stack.imgur.com/1xwZz.png

Я пытался указать точно макс-ширина элемента, но она не работает.

Я хотел бы показать только начало имени, и полное имя в названии элемента,

Мой код теперь выглядит следующим образом:

<div class="table-responsive"> 
<table class="table table-hover table-condensed table-striped"> 
    <thead> 
     <tr> 
      <th>&nbsp;</th> 
      <th>name</th> 
      <th>size</th> 
      <th>&nbsp;</th> 
     </tr> 
    </thead> 
    <tbody id="List"> 
     <tr class="line1"> 
      <td class=""> 
       <img src="gfx/icons/image.png"></td> 
      <td class="fileName"> 
       <a href="#">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa.jpg</a> 
      </td> 
      <td class="fileSize">41.2 kB</td> 
      <td class="delete"> 
       <a class="btn btn-danger btn-xs" href="#"><span class="glyphicon glyphicon-floppy-remove"></span></a> 
      </td> 
     </tr> 
    </tbody> 
</table> 

Answer 1

Как комментарий заявил, что это а не решение, которое вы просили, но альтернативу, поскольку для сокращения имени файла вниз требуется либо JavaScript, либо какой-либо серверный язык, если вы его используете. Если вы укажете предпочтительный способ решения этого вопроса, я могу дать более глубокое решение.

Стол, по-видимому, работает должным образом, и, хотя это плохая практика имеет такие длинные имена файлов, я понимаю, что если вы разрешаете пользователям загружать файлы на веб-сайт, у вас нет контроля над именами файлов. Таким образом, решение, которое я хотел бы использовать в вашем случае некоторые пользовательские CSS:

.filename a { 
    word-break: break-all; 
} 

Это сделает раскол имени файла на две строку, когда это необходимо.