Donate

Bootstrap Table Column Width And Word-Break Not Working Using Data-Width Attribute

Hello All,
One of the issue that I had with Bootstrap Tables by Wenzhixin is that you can't set the width directly using data-width attribute given the code below.
<th data-field="description" data-sortable="true" data-searchable="true" data-width="350px">Description</th>
After doing some research and experiments, the solution that worked for me is to set the Bootstrap Table table-layout style to fixed.
Bootstrap Table CSS
#tblEmployeeDependents{
   table-layout: fixed;
}
And use data-class attribute instead of data-width property to set the column width.
HTML Code
<th data-field="description" data-sortable="true" data-searchable="true"  data-class="tdDescription">Description</th>
Data-Class CSS Style
.tdDescription {   
   width: 350px;
   word-break: break-word;
}

Comments

Donate

Popular Posts From This Blog

WPF CRUD Application Using DataGrid, MVVM Pattern, Entity Framework, And C#.NET

How To Insert Or Add Emojis In Microsoft Teams Status Message

TypeScript Error Or Bug: The term 'tsc' is not recognized as the name of a cmdlet, function, script file, or operable program.