Change background color for a certain line

CSS Codes Pricing Table
1

Add this code to the Custom CSS field on the Appearance tab of your Pricing Table widget’s settings:

.eapps-pricing-table-column-2
.eapps-pricing-table-column-features-item:nth-child(2) {
background: black;
}

Do not forget to add the number of the needed column in column-2 part and the line number in nth-child(2)

2

Hey Max, I am trying to use this code for my table here. (https://f4c48060e82746a49adb320d9d707e6a.elf.site). Unfortunately, I can not seem to get this to work. Or is there a solution to modify the background colour of any listed feature instead of changing the entire row or the entire column?

3

Hi there, @user11212 :waving_hand:

You’re right, that code is a bit outdated, but I see you’ve already found a working solution and added it to your widget:

.es-features-feature:nth-child(2) {
  background-color: green;
}

Please let me know if everything is fine now or if you have any questions left :slightly_smiling_face:

4

Hi! The code worked for me, but it does not work on mobile? Any suggestions?

5

Hi there, @Yana_Paliy :waving_hand: :waving_hand:

I’ve just checked your widget and it seems you’ve already found a solution that works great:

@media (max-width: 767px) {

  .es-features-feature:nth-child(1),
  .es-features-feature:nth-child(27),
  .es-features-feature:nth-child(83),
  .es-features-feature:nth-child(47),
  .es-features-item:nth-child(1),
  .es-features-item:nth-child(27),
  .es-features-item:nth-child(83),
  .es-features-item:nth-child(47) {
    background-color: #99cc99 !important;
    color: #faf9f6 !important;
    text-align: left !important;
  }
}

Please let me know if this code completely resolved the issue or if you have any questions left :slightly_smiling_face: