node.js - Multi-line cells in react-bootstrap-table -

i'm using react-bootstrap-table display data in table format. excerpt current code:

   var table = (             <bootstraptable ref="table" data={converteddata} deleterow={false} striped={true} search={false} pagination={true} hover={true} selectrow={selectrowprop}>                 <tableheadercolumn columnclassname="col-md-1" datafield="field1" iskey={true}>field1</tableheadercolumn>                 <tableheadercolumn columnclassname="col-md-2" datafield="field2" >field2</tableheadercolumn>                 <tableheadercolumn columnclassname="col-md-2" datafield="field3">field3</tableheadercolumn>             </bootstraptable>         );     }      return (         <div>             <h2>{this.props.title}</h2>             {table}         </div>     ) }, 

from css file:

.table td.col-md-7 {   word-wrap: normal;   overflow: auto;   text-overflow: clip; } 

the issue i'm facing cells lot of text, gets scrollbar when want display text in multiple rows within cell.

any ideas on how working?

found approach seems ok:

function multilinecell(cell, row) {     return "<textarea class='form-control cell' rows='3'>" + cell +"</textarea>"; }     [...] <tableheadercolumn columnclassname="col-md-4" dataformat={multilinecell} datafield="summary">summary</tableheadercolumn>