SharePoint: Forced column widths

I finally found a solution.

 

In your SharePoint page where you are displaying the list, add a new “Content Editor WebPart”.  Make that webpart hidden (in its properties).

 

To set All Columns Data with No-Wrap

———————————————-

In the Source Editor of the Content Editor WebPart, add the following code :

 

<style>

.ms-vb2{white-space:nowrap;}

</style>

To set Specific Columns Width

———————————————-

If you want to set a specific width for a specific column, add the code below in the Content Editor WebPart: When calling the OverrideColumnWidth() function in the Load(), you need to modify the [COLUMN NAME] with the name of the SharePoint Column you want to modify (not the display name).

 

 

_spBodyOnLoadFunctionNames.push(“Load”);

 

function Load()

{

OverrideColumnWidth([COLUMN NAME], “300px”);

}

 

function OverrideColumnWidth(FieldName, NewWidth)

{

var sTagID = “diidSort” + FieldName;

 

var el = document.getElementById(sTagID);

if(el == null)

return;

 

// get Parent node which is the tag

var TDParent = el.parentNode;

if(TDParent == null)

return;

 

// Set new width Attribute

TDParent.attributes.getNamedItem(“width”).nodeValue = NewWidth;

 

}