CODEWITHSUNDEEP
htmlhtml-table
user1778856
user1778856

Reputation: 641

HTML - table / td sizing issue

The problem I have is seen here: http://jsfiddle.net/gcgz8/

<table>
  <tr>
    <td class="header">Header</td>
    <td class="line"><div></div></td>
  </tr>
  <tr>
    <td colspan="2">
      <img src="http://i.imgur.com/uO2gVbl.png" width="200px" />
    </td>
  </tr>
</table>

Whenever I add an image or video to my content stuff, the headers and line gets messed up

Upvotes: 0

Views: 78

Answers (1)

Leeish
Leeish

Reputation: 5213

http://jsfiddle.net/gcgz8/3/

Answer: Don't use tables?

<span class="left">Header</span><span class="right"></span>
<p>content content content content content content content content content content content content content content content content content </p>
<span class="left">Header</span><span class="right"></span>
<p><img src="http://i.imgur.com/uO2gVbl.png" width="200px"></p>

CSS

.left {
    display: inline-block;
    width: 12%;
    font-size: 30px;
}
.right {
    display: inline-block;
    width: 88%;
    background: black;
    margin: 25px 0 10px 0;
    height: 5px;
}

This is not my best work, just an example of what you "could" do.

Upvotes: 1

Related Questions