Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • March 29, 2018 at 5:39 pm #934926
    LindaK816

    Hi Support,

    I would like to override the background color on Tables to be transparent. I would also like the text to be white. Thanks for your help on the matter!

    Best,
    LindaK

    March 29, 2018 at 11:24 pm #935053
    LindaK816

    Hi Support – I was able to find some info in your forums and was able to make my table transparent (or rather mostly transparent with a shadow effect which was my goal) – however I have another question. How do you create spacing on the side of the table. First I tried adding a blank cell and that served well as a blank spacer but it has a border around it which is not what I want. I also tried to solve the problem by using columns but wasn’t able to divide the 1/1 layout to contain a sub-area with 1/4 1/4 1/4 1/4 below it. I could have sworn that I was able to do this once. Your thoughts are greatly appreciated on how to solve this dilemma!

    Also in the same area of this table – I added some shading to the background of my table but it is shading my text color. Is there a way to not have it effect the text area?

    Thank you so much!!
    Linda

    March 30, 2018 at 12:36 pm #935273
    Mike

    Hi,
    For the text in your table that has opacity applied to it, please look in your custom css and replace:

    /* font size */
.pricing-table>li {
    font-size: 14px;
    color: #ffffff !important;
    background: #000 !important;
    opacity: .3;
}

    with:

    /* font size */
.pricing-table>li {
    font-size: 14px;
    color: #ffffff !important;
    background: rgba(0, 0, 0,0.3)!important;
}

    For your 1/4 empty cells, I see the one on the right has the class “empty-table-cell” but the one one the left doesn’t. If you add this class to the one on the left you could use this css to hide them both:

    li.empty-table-cell {display:none !important;}

    Best regards,
    Mike

    March 30, 2018 at 2:47 pm #935326
    LindaK816

    Thanks Mike – perfect!! Would you have a suggestion on how to add some padding to the left and right of the top table? I don’t want to add 2 more columns because it will make the 3 columns that have content too squishy.

    March 30, 2018 at 5:02 pm #935363
    LindaK816

    Hi again – I had a thought to reduce the width of the table to 80% but I don’t have the code quite right. This is what I came up with:

    .pricing-table .pricing-table-wrap {
    width: 80%
    }

    Any thoughts?
    Thanks!
    Linda

    March 30, 2018 at 11:43 pm #935481
    Mike

    Hi,
    To reduce the table to 80% and center it, Try this code in the General Styling > Quick CSS field:

    #top.page-id-3666 .post-entry-3666 {
    width: 80%!important; 
    margin: auto!important; 
}

    I assume this means that you won’t need the padding now?

    Best regards,
    Mike

    April 5, 2018 at 7:43 pm #937873
    LindaK816

    Hi Mike – thanks for that! My client changed her mind on how the table should look. Now I am wondering if I can make the two inner columns in my lower table wider so that I can get “Light Commercial Construction” all on one line. I thought maybe if I could isolate the empty column cells and perhaps make them 80% width or so, that might do the trick. What do you think?

    Thanks so much!
    Linda

    April 6, 2018 at 10:35 am #938173
    Mike

    Hi,
    Please try this code, it makes the first and last empty columns width smaller:

    #top.page-id-3666 .avia-table-2 .pricing-table-wrap:nth-child(1),#top.page-id-3666 .avia-table-2 .pricing-table-wrap:nth-child(4) {
    width: 20% !important; 
}

    feel free to adjust to suit.

    Best regards,
    Mike

    June 12, 2018 at 8:52 pm #971831
    LindaK816

    Hi Mike – thanks for your help above! You can close this ticket :)

    Best,
    Linda

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘How to override the background color on Tables’ is closed to new replies.