Is it possible to customize with of each column(Column width)? about react-bootstrap-table

[AllenFang]

Maybe the Column format is your answer :)

[kpaxqin]

@AllenFang
The Column format can customize things in a cell, but what I mean is the width of whole column, including the .
Maybe something like:

<TableHeaderColumn dataField="id" width="25%">Product ID</TableHeaderColumn>

[AllenFang]

There's no way to customize cell currently. If you need, you can give more detail information just like your response, I will spend some time to think about that. :)

[stephenrs]

I will eventually need this feature as well, but was planning to play around in the code (or see if I can just use CSS) before I requested it :)

To clarify the request...currently by default, the component sets up tables so that each column has exactly the same width. In my project, I'll need to optimize column widths so that they show data in the most efficient way. A concrete example (not my project though):

Suppose you want to show a product listing with 2 columns: Product ID, and a descriptive product Summary. You know that the product ID is always only going to be a few characters ("P123"), but summaries could be quite long. Showing a table where each column occupies 50% of the width, just won't look very good, or convey as much information as you might like.

[AllenFang]

Hi @stephenrs , your example and explanation is very useful and maybe I need think hard for default column width or even resizing column :)

[stephenrs]

Adding resizable columns would be amazing!!

[AllenFang]

The column width feature has been added on v0.9.5, you can assign width on column as follow:

<TableHeaderColumn dataField="id" isKey={true} width="15%">Product ID</TableHeaderColumn>
<TableHeaderColumn dataField="name" width="150px">Product Name</TableHeaderColumn>