Side-by-side – shading odd columns

[Michal Riha]

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

Attachments:

1. 

   side-by-side-shadow.png
   

[Michal Riha]

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

Michal

Attachments:

1. 

   12-6-2016-21-34-50.png
   

[Alexander Bautz]

I’m glad you figured it out.

Alexander

[Michal Riha]

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

[Alexander Bautz]

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

[Michal Riha]

Hi Alexander,

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

Michal

[Alexander Bautz]

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

[Michal Riha]

Hi, it is not working for me in displayform.

Michal

[Alexander Bautz]

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

[Michal Riha]

Thanks Alexander,

works nice.

Michal

[Author]

Posts