Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 316
  • Last Modified:

Appending content to a cell in a table with jQuery

I am appending content to a cell in a table with jQuery. The problem is that I am not controlling how many lines of text get in there, so the cell might stretch and thus stretch the row and the neighboring cells. I tried to add: "overflow:auto;" to the style attribute of the table cell, but that didn't help. Is there a way to add to the cell and make the content of it scrollable if the content would otherwise overflow? Or will I have to calculate how many lines go in there and append only that?

Using HTML5.
0
itnifl
Asked:
itnifl
1 Solution
 
Scott Fell, EE MVEDeveloperCommented:
You can get more complex but here is a simple way using css and converting the td to a block and making it scroll http://jsbin.com/opezot/1/edit  Here I use hight but you can also use max-height too.


<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
<style>
.fifty{height:50px; overflow:scroll}
  td{ background-color:#FFCC66;padding:10px;}
</style>
</head>

  <body><table width="400">
  <tr>
    <td>one.one</td>
    <td>one.two</td>
    <td>one.three</td>
  </tr>
  <tr>
    <td>two.one</td>
    <td><div class="fifty">two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two two.two</div></td>
    <td>two.three</td>
  </tr>
  <tr>
    <td>three.one</td>
    <td>three.two</td>
    <td>three.three</td>
  </tr>
</table>
</body>
</html>

Open in new window

0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now