Tagged: 

Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • July 19, 2017 at 8:50 pm #824149
    havi

    Hi guys!

    I am trying to change the two top rows background color for a responsive data table.

    avia-data-table-wrap avia_responsive_table

    I have been able to do it while inspecting the element but when I add the CSS (even if I add !important) it doesn’t respond.

    Tried:

    tr. avia-heading-row {
    background-color: blue !important;
    }

    and

    tr. avia-pricing-row {
    background-color: blue !important;
    }

    but it seems to get overrides by the .main_color tr:nth-child(odd) background.

    I’m sure I am not tackling the right element… where have I gone wrong?

    Thank you so much for your kind help!

    Warmly,

    Havi

    July 19, 2017 at 10:04 pm #824193
    Jordan Shannon

    Hey havi,

    Please provide a link to the site/page in question so we can look into this issue further.

    Best regards,
    Jordan Shannon

    July 19, 2017 at 10:35 pm #824214
    havi

    Hi Jordan!
    It’s on the development stage right now so I would have to give you an IP address to point there (no problem, just let me know)

    But this is just a responsive Enfold table that needs some Quick CSS to add background to the two first rows (heading and pricing rows). We don’t have to limit this to a single page, so if it affects all Enfold tables (not pricing tables) this will do.

    I am attaching a screenshot.

    Screenshot of Table

    Thank you Jordan!!!

    Warmly,

    Havi

    July 19, 2017 at 10:41 pm #824216
    Jordan Shannon

    Hi,

    Would you be able to provide the IP in the private area?

    Best regards,
    Jordan Shannon

    July 19, 2017 at 10:55 pm #824219
    havi
    This reply has been marked as private.
    July 19, 2017 at 11:04 pm #824226
    Jordan Shannon

    Hi,

    I’m not seeing the priving table, just the coming soon countdown.

    Best regards,
    Jordan Shannon

    July 19, 2017 at 11:17 pm #824233
    havi

    Hi Jordan,

    It says Your Support Team. There is no countdown on the Pricing Section (#year) (It could be that you are on the top of the page. The submenu will take you to the pricing section. Or you can scroll down.

    Warmly,

    Havi

    July 19, 2017 at 11:27 pm #824236
    Jordan Shannon

    Hi,

    Please see private

    Best regards,
    Jordan Shannon

    July 19, 2017 at 11:30 pm #824239
    havi

    Hi Jordan,

    That’s the live site. You are not pointing to the IP I sent you. Are you using gas mask to point at it?

    Warmly,

    Havi

    July 19, 2017 at 11:43 pm #824246
    Jordan Shannon

    Hi,

    The ip is giving me 404. Do you have a port number?

    Best regards,
    Jordan Shannon

    July 19, 2017 at 11:46 pm #824248
    havi

    Hi Jordan,

    No such thing. Are you using Gas Mask? Really, there’s no need to even access the site. You can create any table inside of Enfold ALB and you will see what I mean.

    All I need is the name of the element I need to add formatting to.

    Thank you,

    Havi

    July 19, 2017 at 11:50 pm #824250
    havi

    Hi Jordan,

    I just created a table on another website with Enfold too. http://argen-travel.com/travel-guide-to-argentina/

    Scroll all the way to the bottom and you will see it.

    All I need is to add a colored background to the firs two rows.

    Hope this helps,

    Thank you!!

    Havi
    PS: I need to delete this table soon, pls, let me know when you are done.

    July 19, 2017 at 11:52 pm #824251
    Jordan Shannon

    Hi,

    Add the following to quick css:

    table tr.avia-heading-row{
background-color:red!important;
}

table tr:nth-child(2){
background-color:red!important;
}

    Of course adjust the color to whatever you need.

    Best regards,
    Jordan Shannon

    July 19, 2017 at 11:56 pm #824254
    havi

    Genius, Jordan!!

    Thank you!!! I was close but was not getting there ;)

    For whoever else might find this thread interesting, I added white fonts:

    /*Table CSS Modifications*/
    table tr.avia-heading-row{
    background-color: #3d71a1!important;
    color:#fff!important;
    }
    table tr:nth-child(2){
    background-color:#2d5c88!important;
    color:#fff!important;

    Thanks again!!!

    Warmly,

    Havi

    HI Jordan! Quick question, how do you reference the same table but with minimal style?

    • This reply was modified 7 years, 4 months ago by havi. Reason: One additional question re: the same ticket
    July 19, 2017 at 11:57 pm #824255
    Jordan Shannon

    Hi,

    No problem at all, I’m glad we were able to get this solved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 15 posts - 1 through 15 (of 15 total)
  • The topic ‘Change Table top two rows background color’ is closed to new replies.