WordPress.org

Ready to get started?Download WordPress

Forums

TablePress
[resolved] Image on left and 5 rows on the right (6 posts)

  1. Deon B
    Member
    Posted 6 months ago #

    Hi Tobias,
    it's me again with another question about your awesome, life-saving plugin.

    I am trying to get a table made of 2 columns, where on the left you have 1 big image, on the right you have 5 or 6 rows that go for the whole height of the image, like in this quick sketch I have done here:
    http://i.imgur.com/6ZvvxfD.jpg

    How do I achieve that, Tobias?

    Thanks a lot!
    D

    http://wordpress.org/plugins/tablepress/

  2. TobiasBg
    Member
    Plugin Author

    Posted 6 months ago #

    Hi,

    thanks for your question.

    I'm not sure that a table is the (semantically) best choice for this (compared to other HTML elements), but it should be not problem to do this by using the "rowspan" feature.
    On the "Edit" screen, just use the "rowspan" button a couple of times, to merge the cells in the first column. You'll then have one cell in the first column and (for example) five cells in the second column.

    Regards,
    Tobias

  3. Deon B
    Member
    Posted 6 months ago #

    Thanks Tobias,
    you are the best. Looking forward your premium product coming up.

    May I just ask a question?
    You say:
    "I'm not sure that a table is the (semantically) best choice for this (compared to other HTML elements)"

    What would be the best choice to integrate this sort of elements inside my articles?

    Thanks
    D

  4. TobiasBg
    Member
    Plugin Author

    Posted 6 months ago #

    Hi,

    no problem, you are very welcome! :-) Good to hear that this helped!

    Better HTML for this would probably be to use <div> elements as wrappers, or maybe even a list (with <ul> and <li> elements), for the items on the right side.
    Then, you could position the image on the left with some CSS.

    This will require some (small) custom programming with HTML and CSS though, so if you are uncomfortable with that, just stick with the table.

    Regards,
    Tobias

  5. Deon B
    Member
    Posted 6 months ago #

    Thanks Tobias,

    I'm sure I have read this somewhere in your faq, so I apologize for asking it here but how do I get rid of the horizontal lines and display the vertical ones instead?

    Thanks
    D

  6. TobiasBg
    Member
    Plugin Author

    Posted 6 months ago #

    Hi,

    to get rid of the horizontal lines, in favor of vertical border lines, please try adding this code to the "Custom CSS" textarea (don't forget to change the table ID as necessary):

    .tablepress-id-123 tbody td,
    .tablepress-id-123 thead th {
            border-top: 0;
            border-left: 1px solid #dddddd;
    }
    .tablepress-id-123 tbody td:first-child,
    .tablepress-id-123 thead th:first-child {
            border-left: 0;
    }

    Regards,
    Tobias

Reply

You must log in to post.

About this Plugin

About this Topic

Tags

No tags yet.