Side-by-side – shading odd columns

Forums Dynamic Forms for SharePoint Side-by-side – shading odd columns

This topic contains 9 replies, has 2 voices, and was last updated by  Říha Michal 1 year ago.

  • Author
    Posts
  • #11963

    Říha Michal
    Participant

    Hi Alexander,
    is it possible easily (not field css) shade odd colums?
    Thanks
    Michal

  • #11987

    Říha Michal
    Participant

    Solved:
    .sbs_tdIndex_2 input, .sbs_tdIndex_4 input, .sbs_tdIndex_6 input, .sbs_tdIndex_8 input { background-color:#fbe4e5 !important; }

    Michal

  • #11991

    Alexander Bautz
    Keymaster

    I’m glad you figured it out.

    Alexander

  • #12265

    Říha Michal
    Participant

    Hi Alexander,

    is there any simple way how to do it in display form?
    I consider that there is only one possibility – use field CSS (for each individual field)…

    The aim is to show display form in the same visual style as edit form = like “form” – values are in a frame (like in screenshot attached).

    Michal

  • #12285

    Alexander Bautz
    Keymaster

    Hi,
    You can try something like this in the custom css:

    .sbs_Field .dffs_tdWrap{
        border:1px red solid;
        padding:3px;
    }

    You must obviously change the color and other style, but you get the picture.

    Alexander

  • #12348

    Říha Michal
    Participant

    Hi Alexander,

    thanks, it works (for every “table” cell) I suppose that shade odd colums must be done via Field CSS..

    Michal

  • #12391

    Alexander Bautz
    Keymaster

    Sorry for the delay – you can use this CSS to shade odd columns in a side-by-side setup:

    tr.sbs_OuterTR:nth-child(odd){
        background-color:red;
    }

    Alexander

  • #12745

    Říha Michal
    Participant

    Hi, it is not working for me in displayform.

    Michal

  • #12779

    Alexander Bautz
    Keymaster

    Sorry, my bad – the nth-child selector will not work in IE 8.

    Try this in the custom js – call the function “colorOddRows” in a rule with trigger “selected tab index” = the tab where you use the SBS.

    function colorOddRows(){
    $("tr.sbs_OuterTR:odd").css({"background-color":"red"});
    }

    Alexander

  • #13826

    Říha Michal
    Participant

    Thanks Alexander,

    works nice.

    Michal

You must be logged in to reply to this topic.