Question

I got a problem :S I’m trying to add a div and a table into two tds and align them vertically by css. This looks like this:

<table>
  <tr>
    <td style='vertical-align: text-top;'>
      <table>
         <tr>
            <td>Some Randomness on some lines<br><br><br>until here.</td>
         </tr>
      </table>
    </td>
    <td style='vertical-align: text-top;'>
      <div style='width: 300px; height: 300px; border: 1px solid red;'>
        Some Random text here also on a few lines...<br><br><br>until here.
      </div>
    </td>
  </tr>
</table>

Now, the div appears just on the level of the last row of the left table. Why is this like this? ….. I got this problem earlier with images, but i just solved it by resizing the image…

Thanks for help!

Flo

Answer 1

try to use “vertical-align:top“

<table>
  <tr>
    <td style='vertical-align: top;'>
      <table>
         <tr>
            <td>Some Randomness on some lines<br><br><br>until here.</td>
         </tr>
      </table>
    </td>
    <td style='vertical-align: top;'>
      <div style='width: 300px; height: 300px; border: 1px solid red;'>
        Some Random text here also on a few lines...<br><br><br>until here.
      </div>
    </td>
  </tr>
</table>