Column Width in Quick Edit or Datasheet View

Question

Is there a way to adjust the column widths or enable text wrapping in the Quick Edit or Datasheet view in SharePoint 2013?

I have seen ways to set widths in the standard list view (using CSS), but these do not seem to be able to change the width in Quick Edit mode.

Answer 1

After a lot of searching, the following did the trick for me. This enables text wrapping in the Quick Edit view.

.ms-spGrid-HeaderContentStyle div{
white-space: normal;
}

Answer 2

Unfortunately, the answer provided didn't completely help my situation. We were able to use the CSS provided by EvanC to wrap the column headers but the column itself was still not adjusting. The following CSS to adjust the width of a multi-line field fixed what we needed.

.ms-rtestate-field{
      width: 100px;
 }

Thanks to EvanC for the original answer and pointing us in the right direction!

Answer 3

Use "th.ms-v2 div[DisplayName='Notes']..." for non-datasheet view. Use "th[Title='Notes']..." for datasheet view. Change "Notes" to the name of the field/column header that you want to modify.

<style>
th.ms-vh2 div[DisplayName='Notes']{
    min-width:350px !important;
    width:350px !important;
}
th[Title='Notes']{
    min-width:350px !important;
    width:350px !important;
}
</style>