CSS List Forms Lookup SharePoint SharePoint 2013 SharePoint 2016 SharePoint Online SharePoint Server 

Increase SharePoint 2013 Lookup Column Width

Salaudeen Rajack 5 Comments

Requirement: Increase SharePoint 2013 multi-lookup field width

Solution: Use CSS styles to set lookup field width in SharePoint! Here is how:

  • Navigate to: http://your-sharepoint-site.com/Lists/Your-List/editform.aspx
  • Click on “Site Settings” gear >> Edit Page
  • Click on the “Add Web Part” link and then choose “Script Editor “from the “Media and Content” group
  • Click on “Edit Snippet” link script editor and paste the below CSS in it. Save and close the page.
<style>
.ms-formtable table.ms-long {
    width:600px !important;
}

.ms-formtable table.ms-long .ms-input>select {
    width:300px !important;
}
</style>

Before:

sharepoint lookup column width

After:
sharepoint multi lookup field width

Salaudeen Rajack

Salaudeen Rajack is a SharePoint Architect with Two decades of SharePoint Experience. He loves sharing his knowledge and experiences with the SharePoint community, through his real-world articles!

5 thoughts on “Increase SharePoint 2013 Lookup Column Width”

  • June 5, 2020 at 9:29 PM

    Note there is one typo in your code snipper,

    The line:
    .ms-formtable table.ms-long .ms-input>select {
    should be:
    .ms-formtable table.ms-long .ms-input select {

    Reply
  • August 29, 2019 at 10:06 AM

    thank you for this! ive been searching for DAYS! you are awesome!

    Reply
  • November 17, 2017 at 5:51 PM

    This solution worked for me. Thanks so much.

    Amarjit

    Reply
  • December 19, 2016 at 2:21 PM

    Hi!
    For me this solution works on some forms and on some it doesn’t. Ideas why?

    Reply
  • September 16, 2016 at 3:41 PM

    Good morning I attempted this solution and it is not working for me.

    Can you please provide more detail?

    Reply

Leave a Reply