I have a list that involves an item description of a few sentences. This makes each item take up a lot of vertical space on the page when someone views the list in a browser. I can't figure out how to edit the column width so it is more sensibly sized to hold a small paragraph. I tried going into the SP designer, to the list, to the view, to design mode, changing the width manually by clicking and dragging, and saving. However, it doesn't update the list when I go to the page and view it in a browser. How can I make this work? Thanks!

  • Do you have the option of displaying the data in a custom DataView built in Designer? Or do you have to display it in the default list views? – Erin L Dec 11 '15 at 22:17

You can add a content editor web part to your view page with a content link to a css file containing:

td.ms-vb2 div[dir='']{

This will only work if you only have one field on the page that's multiple lines of text (or if you have multiples but you're fine with all of them being the same width).

  • Where should I add this? – J. Osborn Dec 14 '15 at 12:51
  • I use a site assets library to hold the css file. Then on whatever page you're viewing the list, Edit Page, Click Add a Web Part, select the Content Editor Web Part, and point the CEWP to your css file. – Erin L Dec 17 '15 at 16:57

Work this CSS into your page:

/* ListView - make Description fields a maximum width and height, and show full text on mouseover*/
/*.ms-itmhover is the TR row*/
.ms-vb2  .ms-rtestate-field{
.ms-vb2  .ms-rtestate-field:hover{
  • Where in the CSS? or does it not matter? – J. Osborn Dec 14 '15 at 12:51
  • Add it in an exsiting CSS file, or with a CEWP inside <style> tags or using a StyleBot browser extension (last one only applies to your browser) – Danny '365CSI' Engelman Dec 14 '15 at 12:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.