Support » Theme: picolight » [Theme: picolight] Strange problem with HTML tables when added to page in Picolight

  • I’m adding a new page to my Picolight-themed blog. It’s a simple page containing one table that’s supposed to cover 100% of the available area in the column. The problem is that the table is only using about 50% of the area, even though I declare it otherwise in the HTML. If I start off the page with some dummy text that takes more than a single line everything works correctly and the table is fine. If I remove that text then the table shrinks back to 50%, which is the minimum space required to display the text in the TD fields.

    The code looks like this :

    <table border="0" cellspacing="4" cellpadding="4" width="100%">
      <tr>
        <td>
            <b>Just Some Text</b>
        </td>
        <td>
            <b>Some More Text</b>
        </td>
      </tr>
    </table>

    If you add “BlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlah” at the top of the WYSIWYG area the table displays correctly but if you delete that text the table contracts despite the “width=”100%” declaration.

    Am I missing something?

    Please advise / thanks!

    http://wordpress.org/extend/themes/picolight/

Viewing 5 replies - 1 through 5 (of 5 total)
  • Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    It may be 100% width, but the containing HTML element that surrounds your table may have a smaller-than-expected set width, or its parent container etc.

    The HTML table width attribute may also be deprecated.

    Thanks for the reply.

    According to the W3schools.com website the table width attribute is not deprecated and is currently supported by all major browsers. I’ve never had a problem with this construct in any number of environments – in fact it’s working just fine in another WordPress 3.4.1 blog that I’ve built using a different theme so that’s why I posted this report in the hopes of finding a fix or workaround.

    For what it’s worth, even the equivalent inline CSS construct <table style=”width:100%;”> doesn’t appear to work right either.

    The HTML element surrounding the table doesn’t appear to be an issue because if you precede the table with a line or two of text as mentioned in my original post then the table expands to fill the entire column as expected.

    The net-net is that for whatever reason it appears that the table width attribute is being ignored or otherwise overridden in this theme …

    WPyogi

    (@wpyogi)

    Forum Moderator

    Posting a link to your site would make it easier for people to give you better help. As is, almost impossible to help much.

    Thanks for the reply, but I unfortunately can’t post the link to a client’s proprietary website while it’s still under development. The code I provided in my original post is sufficient to replicate the problem so a link to the actual site doesn’t buy much … and it’s the best I can do under the circumstances. Sorry!

    Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    May you http://www.pastebin.com the HTML and CSS of the problematic page?

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘[Theme: picolight] Strange problem with HTML tables when added to page in Picolight’ is closed to new replies.