Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1248731

    Hi all,

    Anyone can provide me with a quick css to do the following on a 2 column table?

    1. Define the width of the first column
    2. Align the text on the first column to the right
    3. align the text on the second column to the left

    – If 2 and 3 are not possible at the same time then align columns to the left would do.

    Thank you

    #1248915

    Hey agougo,

    Could you post a link to where we can see the element in question please? If you have a mockup or screenshot highlighting your intentions then that would help as well.

    Best regards,
    Rikard

    #1248934

    Hello,

    I am sending a link so that you can see my portfolio item page. In this page I have created a table (mytable) that looks like this:

    Column | Column
    Client | Text
    Year | Text

    When I put some text on the second column. i.e. text, the text is too far away and it looks ugly. What i would like to do is:
    Shorten the width on the first column, so that the text is closer to the client or the year. Or make the table columns Column1: 20% – Column2: 80%
    I would also like all text to be the same color, i.e. #5c5c5c
    Finally align the text to the left.

    Below this table (on the link that i sent you) is a text field with the end result (kinda) :)

    Thank you

    #1249249

    Hi,

    Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:

    .mytable .pricing-table-wrap {
        display: inline-block;
    }
    
    .mytable .pricing-table-wrap li {
        text-align: left;
    }
    
    .mytable .pricing-table>li:nth-child(even) {
        color: #5c5c5c;
    }

    Best regards,
    Rikard

    • This reply was modified 4 years, 1 month ago by Rikard.
    #1249497

    Yeap, it works with minor modifications.
    Thanks for the assistance!

    #mytable { margin: 0px; }
    .mytable .pricing-table-wrap { display: inline-block; margin: 0px; }
    .mytable .pricing-table-wrap li { text-align: left; font-size: 15px; font-family: “Josefin Sans”; padding: 0px; }
    .mytable .pricing-table>li:nth-child(even) { color: #5c5c5c; }

    #1249526

    Hi,

    Did you need additional help with this topic or shall we close?

    Best regards,
    Jordan Shannon

    #1249576

    Hello, You can close this.Thanks again.

    #1249749

    Hi,

    If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Table Adjustments – Width – text-align’ is closed to new replies.