[Plugin: WP-Table Reloaded] Table align left, text on right

  • Resolved jjsbetteroff

    (@jjsbetteroff)


    13 years, 11 months ago

    HI Tobias, thank you for the wonderful plugin mate, many thanks, as soon as i get some cash from teh site, youll get a coffee!

    For now, I have a problem I really need help with.
    http://dropkickrugby.com/bet365-review/

    I’m using a few tables around my site. On one page, i’m trying to put a table across the top of a page with no sidebars ( which I have done ok).

    Then, Im trying to put a table on the left under this table, and text on the right.
    SO the problem is that I cannot get the spacing right, and the text and table are overlapping. I got some information from other threads, but none seem to be working.

    The first two lines of my HTML on the page are, Table ten is displaying fine with no problems
    ;
    [table id=10 /]
    <p style=”text-align: justify;”><div style=”width:30%; text-align:left; float: left;”>[table id=11 /]</div>
    There’s then text to the right of this, but on the rendered page, it is overlapping with table 11.

    The CSS i’m using so far is;

    .wp-table-reloaded-id-11 {
    width: 30%!important;
    }
    .wp-table-reloaded-id-11, .wp-table-reloaded-id-11 td, .wp-table-reloaded-id-11 th {
    border: 3!important;
    padding: 4px;
    border-spacing: 3px!important;
    }

    I did have column widths but they werent helping, and im probably mixing up px and percentages. I know nothing about CSS, can you please help! 😉

    THanks so much.

    http://ww.wp.xz.cn/extend/plugins/wp-table-reloaded/

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author Tobias Bäthge

    (@tobiasbg)

    13 years, 11 months ago

    Hi,

    thanks for your post.

    The problem here simply is that 30% width is not enough for the table: The content in the columns (especially the URLs to other sites) require more widths, as the browser can not word wrap them (because they don’t contain spaces or dashes or other characters where word wrapping can happen).
    So, due to that, the browser will give the table are width that is bigger than the 30% that you would like.
    So, either change the widths of the <div> to around 42% or make the content in the table more narrow, e.g. by manually wrapping it.

    Regards,
    Tobias

    Thread Starter jjsbetteroff

    (@jjsbetteroff)

    13 years, 11 months ago

    Hi Tobias, thanks for coming back to me so soon.

    THat makes sense alright.

    Can I ask you, can I put percentages in the CSS for each column, if I have a percentage in the div?

    Also, how can I make sure there’s a small gap between the edge of the table and the text?

    And lastly, there doesnt seem to be any border on the table yet I havent specified no border, any idea there?

    Thanks again, really appreciate it

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    13 years, 11 months ago

    Hi,

    yes, you can put percentages into the CSS as the column widths, and actually doing that instead of using an extra <div> might work here.
    Please try this:

    1: Remove the <div> arond the table (so that you only have the Shortcode and the text).
    2. Remove the current “Custom CSS” for this table.
    3. Add this to the “Custom CSS”:

    .wp-table-reloaded-id-11 {
  width: 45% !important;
  float: left !important;
  margin-right: 10px !important;
  margin-bottom: 5px !important;
}
.wp-table-reloaded-id-11, .wp-table-reloaded-id-11 td, .wp-table-reloaded-id-11 th {
border: 3px solid #000000!important;
padding: 4px;
border-spacing: 3px!important;
}

    This should also fix the issue with border, which happened because your current declaration (border: 3) is invalid.

    Regards,
    Tobias

    Thread Starter jjsbetteroff

    (@jjsbetteroff)

    13 years, 11 months ago

    Tobias you’re an absolute gent, thank you so much! That looks great.

    I might play around with it for a while today and this evening and make sure i’m good then i’ll come back and mark this resolved.

    Thanks again, really appreciate it

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    13 years, 11 months ago

    Hi,

    sure, no problem, you are very welcome! 🙂

    Best wishes,
    Tobias

    Thread Starter jjsbetteroff

    (@jjsbetteroff)

    13 years, 11 months ago

    Hi Tobias, this is all good now and i’ve got the hang of it. I might come back to you in future with a few querys, as i finally get the site moving, but for now, many thanks, youve been amazingly helpful.

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    13 years, 11 months ago

    Hi,

    thanks for the confirmation. 🙂 Nice to hear that it works!

    Best wishes,
    Tobias

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘[Plugin: WP-Table Reloaded] Table align left, text on right’ is closed to new replies.