Div at the bottom of table

Discussion in 'HTML & Website Design' started by mustaineoz, Apr 18, 2007.

  1. #1
    I have a table and inside the table,there is a div.Something like this

    <td align="center" valign="middle"> Bla Bla Bla
    <div style="vertical-align:bottom; text-align:center ">BLA BLA</div>
    </td>

    I want to put the div at the bottom of td!With the code above,both of them are at the middle of td.But it is not the thing what i want.
     
    mustaineoz, Apr 18, 2007 IP
  2. webcosmo

    webcosmo Notable Member

    Messages:
    5,840
    Likes Received:
    153
    Best Answers:
    2
    Trophy Points:
    255
    #2
    since you have <td align="center" valign="middle"> its putting them in the middle. what you can do is define another table for the div to place it at the bottom:
    <td align="center" valign="middle"> Bla Bla Bla
    <table height="100%">
    <tr><td height="100%">
    <div style="vertical-align:bottom; text-align:center ">BLA BLA</div>
    </td></tr>
    </table>
    </td>

    ---i think it will work. 100% height with div doesnt work as I know. so you have to use a table. hope it helps.
     
    webcosmo, Apr 18, 2007 IP
  3. mustaineoz

    mustaineoz Active Member

    Messages:
    326
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    58
    #3
    Sorry,i tried but it didnt work.
    When i tried webcosmo method,both of them went up instead of down,so i think it didnt work cuz of height=100%

    Any other suggestions?
     
    mustaineoz, Apr 18, 2007 IP
  4. webcosmo

    webcosmo Notable Member

    Messages:
    5,840
    Likes Received:
    153
    Best Answers:
    2
    Trophy Points:
    255
    #4
    try this, i tested this, it works:
    <html>

    <head>
    <title>test page</title>
    </head>
    <body style="padding:0px;margin:0px;">

    <table width="400" height="100%" bgcolor="#0Ac53c" cellpadding="0" cellspacing="0" border="0">
    <tr>
    <td align="center" valign="middle" height="100%">
    BLA BLA BLA
    </td>
    </tr>
    <tr>
    <td>a
    </td>
    </tr>
    </table>

    </body>
    </html>
     
    webcosmo, Apr 18, 2007 IP
  5. mustaineoz

    mustaineoz Active Member

    Messages:
    326
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    58
    #5
    thank you webcosmo,now it works
     
    mustaineoz, Apr 19, 2007 IP