Simple Table Grids Without Images

When designing an internet application that must provide results in a grid, many developers will use small (1 pixel by 1 pixel) images in order to create a grid effect (similar to an Excel spreadsheet). An easier way to accomplish this task is to use nested tables.

By combining two levels of tables, you can effectively create a grid effect. Also, you’ll be reducing the chance that the image is unavailable for download and that you’ll have to repeatedly code the image tag and attributes.

In the first table, set the cellpadding and cellspacing attributes equal to zero and define a bgcolor?the color of the grid. In the nested table, set the cellpadding attribute to whatever you like, but use the cellspacing attribute to define the width of the grid lines. For example, cellspacing=1 will have small grid lines, while cellspacing=5 will have large grid lines.

Here’s an example using nested tables:

 
....Data....

Note: Tables are not rendered by the browser until the entire table is received during the download of the HTML page. Extremely large tables can take some time to render which may cause users to think that your page is slow.

Share the Post:
Share on facebook
Share on twitter
Share on linkedin

Overview

The Latest

microsoft careers

Top Careers at Microsoft

Microsoft has gained its position as one of the top companies in the world, and Microsoft careers are flourishing. This multinational company is efficiently developing popular software and computers with other consumer electronics. It is a dream come true for so many people to acquire a high paid, high-prestige job

your company's audio

4 Areas of Your Company Where Your Audio Really Matters

Your company probably relies on audio more than you realize. Whether you’re creating a spoken text message to a colleague or giving a speech, you want your audio to shine. Otherwise, you could cause avoidable friction points and potentially hurt your brand reputation. For example, let’s say you create a

chrome os developer mode

How to Turn on Chrome OS Developer Mode

Google’s Chrome OS is a popular operating system that is widely used on Chromebooks and other devices. While it is designed to be simple and user-friendly, there are times when users may want to access additional features and functionality. One way to do this is by turning on Chrome OS