Display form columns css

Forums General discussion Display form columns css

This topic contains 10 replies, has 2 voices, and was last updated by  Alexander Bautz 3 months, 1 week ago.

  • Author
    Posts
  • #23015

    Joel Hjalmarsson
    Participant

    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:
  • #23040

    Alexander Bautz
    Keymaster

    Add this to the Custom CSS tab:

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

    Alexander

  • #23052

    Joel Hjalmarsson
    Participant

    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.

  • #23054

    Alexander Bautz
    Keymaster

    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

  • #23056

    Joel Hjalmarsson
    Participant

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

  • #23058

    Joel Hjalmarsson
    Participant

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

  • #23062

    Joel Hjalmarsson
    Participant

    Looks like this

    Attachments:
  • #23065

    Joel Hjalmarsson
    Participant

    And this is the culprit

    Attachments:
  • #23068

    Joel Hjalmarsson
    Participant

    got it working.. yay.. had to use

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

  • #23070

    Joel Hjalmarsson
    Participant

    thank you very much.

  • #23077

    Alexander Bautz
    Keymaster

    I’m glad you figured it out.

    Alexander

You must be logged in to reply to this topic.