How to align table to top

Discussion in 'HTML & Website Design' started by ddzc, Apr 23, 2009.

  1. #1
    Hi all,

    I have a wordpress blog. I created a large table sectioned in to 4 rows and 4 columns. I have images in the rows and columns with text beside them. I tried TD Valign=top but it only adjusts the height of the text in each column/rown.

    The problem i'm having is that the entire table is like aligned 15 lines below the title of the post. There is huge white space in between the title and table.

    The HTML looks like the below:

    <TABLE>
    <TR>
    <TD>
    </TD>
    </TR>

    <TR>
    <TD>
    </TD>
    </TR>

    <TR>
    <TD>
    </TD>
    </TR>

    <TR>
    <TD>
    </TD>
    </TR>
    </TABLE>


    Any suggestions?


    Thanks
     
    ddzc, Apr 23, 2009 IP
  2. designgenerator

    designgenerator Guest

    Messages:
    118
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    you should look not onto table but on the table container tags... most likely <div ...> etc...
    as far as I see now there's a problem with style cascading... if you upload the page, or provide a link to it, it would be easier to tell what exactly you should do.
     
    designgenerator, Apr 24, 2009 IP
  3. ddzc

    ddzc Peon

    Messages:
    487
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Here is an example of something I want to do

    http://i3.photobucket.com/albums/y92/ddzc/img.jpg

    I have 12 boxes though. The text is a link centered with an image next to it. I have 4 columns and 3 rows in one table.

    How can I best accomplish this in wordpress - html?

    I currenly have it like:

    <table>
    <tr>
    <TD>
    <h5><a href="http://www.google.com" target="_blank" onmouseover="window.status='http://www.google.com';return true;"onmouseout="window.status=' ';return true;">Google</a>
    </TD>
    <TD><img src="images_big/walmart.jpg">
    </TD>
    </TR>
    </TABLE></p>

    For each row, I have several TD statement for all 4 boxes, until I close the TR statement on the 4th box and start on the next row with new TR and TD statements for boxes 5-8, etc, etc.

    Thanks
     
    ddzc, Apr 24, 2009 IP
  4. nathg

    nathg Peon

    Messages:
    5
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    In your code I can see <h5> and </p> tags . Heading and Paragraph tags will take spaces default.
    If you upload your page any where It will be most helpful to help you further.
     
    nathg, Apr 24, 2009 IP
  5. nathg

    nathg Peon

    Messages:
    5
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    In your code I can see <h5> and </p> tags . Heading and Paragraph tags will take spaces default.
    If you upload your page any where It will be most helpful to help you further.
     
    nathg, Apr 24, 2009 IP
  6. Michamus

    Michamus Peon

    Messages:
    58
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Try using the following:
    
    <table valign="top">
    <tr>
    <TD>
    <a href="http://www.google.com" target="_blank" onmouseover="window.status='http://www.google.com';return true;"onmouseout="window.status=' ';return true;">Google</a>
    </TD>
    <TD><img src="images_big/walmart.jpg">
    </TD>
    </TR>
    </TABLE>
    
    Code (markup):
    You should never leave an open tag. Period. On the code you provided you had a paragraph tag closing without and opening tag, and a header tag open, without a closing tag.

    These will cause unpredictable issues when the browser translates the information, which can include crazy (or strange) spacing.

    Let me know if this helps you, if not I will need the code for the entire section to really debug it.
     
    Michamus, Apr 24, 2009 IP