How to Scroll a Background in a Table Cell

You can use an HTML table to organize data, or position design elements on an HTML page. You can also code a background image to show in a table's cell and change the cell to a fixed size to accommodate the height and width of the image. You will need to upload an animated scrolling image to your website host and place the URL for this image in your code to create a scrolling background inside of the table cell.

Instructions

1. Highlight the following code with your mouse, right click and choose "Copy" from the menu:

   <table border="0">

   <tr>

   <td height=100 width=100 style="background-image:url('IMAGE')>TEXT</td>

   </tr>

   </table>

2. Open your webpage in a text or online editor.

3. Right-click and select "Paste" from the menu to place a copy of the table code in your page's HTML.

4. Replace "IMAGE" with the full URL for your scrolling animated image. Do not remove the quotes from the code.

5. Replace "TEXT" with text that you want to display over top of the scrolling image. If you do not want text, you can remove this.

6. Change the "100" value for the height and width to match the size of the image in your cell's background. You may need to experiment with this until you find a size that works.

7. Save the changes to your code and upload your webpage. When you next visit your webpage, you will see the scrolling animated image as the background for your table's cell.

References

• W3Schools: HTML <table> Tag
• W3Schools: Tryit Editor