如何在表上抑制水平滚动条

Question

我想要一个包含固定宽度和 td 单元格的Google可视化表格。当我在绘制方法中指定宽度时，会出现水平滚动条。而不是这个，我想要包裹细胞。

This jsfiddle是一个有效的例子。在这个例子中，我希望第一列包装。我尝试使用自动换行：break-word; 添加一个类。但这不起作用。

这是相关的js：

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）