Как подавить горизонтальную полосу прокрутки на таблице

Question

Мне нужна таблица визуализации Google с фиксированной шириной и td ячейки, которые переносятся. Когда я укажу ширину в методе рисования, появится горизонтальная полоса прокрутки. Вместо этого я хочу обертывание ячеек.

This jsfiddle является рабочим примером. В этом примере я хотел бы, чтобы первый столбец был обернут. Я попытался добавить класс с word-wrap: break-word;. Но это не работает.

Вот соответствующие ЯШ:

function drawChart() { 
var cssClassNames = { 
    'tableCell': 'googlecell' 
}; 

var datatable = new google.visualization.DataTable(); 

datatable.addColumn('string', 'Keyword', 'col1'); 
datatable.addColumn('number', 'Pageviews'); 
datatable.addColumn('number', 'Secs.'); 


datatable.addRows(3); 
datatable.setCell(0, 0, '(not set)'); 
datatable.setCell(0, 1, 20308); 
datatable.setCell(0, 2, 68.74); 
datatable.setCell(1, 0, '(not provided)'); 
datatable.setCell(1, 1, 14410); 
datatable.setCell(1, 2, 49.99); 
datatable.setCell(2, 0, 'product_type_l1==sdsssijven&+product_type_l2==*'); 
datatable.setCell(2, 1, 3838); 
datatable.setCell(2, 2, 48.35); 

var table = new google.visualization.Table(document.getElementById('table_div')); 

table.draw(datatable, { 
    showRowNumber: false, 
     'allowHtml': true, 
     'cssClassNames': cssClassNames, 
    width: 400 
}); 



} 

google.load("visualization", "1", { 
    packages: ["corechart", "table"] 
}); 

google.setOnLoadCallback(drawChart); 

И отношение CSS:

.googlecell { 
word-wrap: break-word; 
} 

Answer 1

насчет:

.googlecell { 
    word-break: break-all; 
} 

Это то, что вы после этого? (demo)