Tagged: , ,

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • August 20, 2015 at 4:52 am #490525
    Owen

    I have been reading all the past posts on changing background row colors, etc, but there are several elements that I would like to change and I can’t figure out how to change them.

    I have created a Custom CSS Class for my table (OJO-PricingTable) and have successfully used:

    .OJO-PricingTable .pricing-table li.avia-heading-row { background-color: yellow; color: green; border-color: black}
    .OJO-PricingTable .pricing-table li.avia-pricing-row { background-color: orange; color: green; border-color: black; }
    .OJO-PricingTable .pricing-table li.avia-button-row { background-color: blue; border-color: black; }

    What I haven’t been able to change is:
    pricing-row
    Currency color (dollar sign)
    text color (additional text like “per month”)

    default-row
    background-color
    text color
    border color

    Could you lead me in the right direction?

    Thanks,
    -Owen

    August 20, 2015 at 4:55 am #490526
    Owen

    I probably should add that since I have have multiple “default-row”s , it would be good to be able to change the attributes of each of the rows individually.

    Thanks again!
    -Owen

    August 21, 2015 at 11:03 am #491246
    Rikard

    Hi,

    This is the default CSS of the Currency symbol: 

    .avia_pricing_default .pricing-table li.avia-pricing-row .currency-symbol {
    opacity: 0.4;
    color: #000;
    filter: alpha(opacity=40);
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}

    The default rows you should be able to target with the following and then overriding the rows which have classes: 

    ul.pricing-table li

    Targeting individual list items you would probably have to use a child selector:

    http://www.w3schools.com/cssref/sel_nth-child.asp

    Thanks,
    Rikard

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.