SharePoint Tips

Thursday, December 7, 2017

SharePoint 2013 : Expand width of Column in List

To expand column width in any list or library, open the list, edit page and add a content editor web part in that page.

In source editor of content editor web part add below CSS:

<div class="ms-rtestate-read ms-rte-embedcode ms-rte-embedil ms-rtestate-notify s4-wpActive" contenteditable="false">​<style type="text/css">.ms-vh-div[DisplayName='Display Name of Column']{ width:550px;}</style></div>

Second Way



1.Go to the list you want to edit, and press F12. Then you will see the following tool.
2.Click the first arrow button and select the column you want to edit. Then you will see the column related codes.

 
3.Pay attention to the class=”XXXX”, and copy the XXXX. (Here is ms-vh2)
4.Add the following codes to the content edit web part.
<style type="text/css">
.XXXX {
width:50px; (you could change the number as you want)
}
</style>


Third Way


Replace Description with whatever the coulmn name is. And edit the width.
<style type='text/css'>.ms-vh-div[DisplayName='Description']{ width:250px;}</style>

No comments:

Post a Comment