Display form columns css

[Joel Hjalmarsson]

Hi
I have an issue with my display form and how it renders. The New form and edit form renders perfectly but the dsiplay form looks awful. The left column pushes out the other columns as i have a question that is rather long and it doesn’t seem to wrap. I have yet to figure out how to change this. I want it to look as neat as the other forms.

Attachments:

1. 

   dffs-question.png
   

[Alexander Bautz]

Add this to the Custom CSS tab:

td.ms-formlabel{
    width:200px; // Set to the preferred width
    white-space:normal;
}

Alexander

[Joel Hjalmarsson]

Thank you for that but its not changing anything. I have no errors when i paste it in and have reloaded cleaned cache and all and still looks bad.

[Alexander Bautz]

Are you 100% sure you have added the code to the correct form?
If so, you can try adding the !important flag like this:

td.ms-formlabel{
    width:200px!important; // Set to the preferred width
    white-space:normal!important;
}

You can use the developer tools to see what style is applied – right click the item you want to look at and select Inspect – now you can see the style in the dev tools.

Alexander

[Joel Hjalmarsson]

Yep.. its in the display form tab I’ll add that and see what happens.

[Joel Hjalmarsson]

I think the formlabel needs a word wrap also?? As there is one question that pushes it all out?

[Joel Hjalmarsson]

Looks like this

Attachments:

1. 

   css1.png
   

[Joel Hjalmarsson]

And this is the culprit

Attachments:

1. 

   culprit.png
   

[Joel Hjalmarsson]

got it working.. yay.. had to use

.ms-formlabel{
width:35px;
white-space:normal;
word-wrap:normal;
}

[Joel Hjalmarsson]

thank you very much.

[Alexander Bautz]

I’m glad you figured it out.

Alexander

[Author]

Posts