Таблица выходит за границы ячейки

391

10 декабря 2016, 10:33

На странице в bootstrap ячейку помещена таблица, в таблице достаточное количество столбцов, и на экранах ноутбуков эта таблица выходит за границы отведенной для нее ячеки

код страницы в этом месте:

<div class="col-md-9">
    <div class="row tablica">
        <table class="table table-striped tablesorter">
            <thead>
                <tr>
                    .....
                    <th>класс</th>
                    <th>расположение</th>
                </tr>
            </thead>
            <tbody>
                ...
                <tr>
                    <td>текст</td>
                    <td>текст</td>
                </tr>
                <tr>
                    <td>текст</td>
                    <td>текст</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

Как сделать так, что бы таблица полностью поместилась в выделенный ей блок, а текст в широких столбцах скрылся за границами столбцов, но при hover на ячейку таблицы "ездил" "туда-назад"?

Answer 1

Если Вы пишете, что в таблице достаточное кол-во строк, может она банально не помещается в отведенное ей место? Если так, используйте .table-responsive

<div class="col-md-9">
  <div class="row tablica table-responsive">
    <table class="table table-striped tablesorter">
      ...
    </table>
  </div>
</div>