Common Questions

A table is a structured way of organizing data. A table allows you to look up values quickly and easily that indicate some kind of connection between different types of data, for example a car and its brand or the schedule for a class at the gym.

The point of a table is to present information in an easy-to-understand way. You can glean the answer to a question by making visual associations between row and column headers.

If you’d like to create an HTML table on the fly, you can check out our HTML Table Generator.

HTML tables should be used for tabular data — this is what they are designed for. Unfortunately, many web developers have previously used HTML tables to lay out web pages, which is a problem because HTML tables were not designed for this purpose. This was commonly used because CSS support across browsers used to be terrible; table layouts are much less common nowadays, but you might still see them in some corners of the web.

While HTML tables aren't the best choice for designing a responsive website, they can still be useful in some situations. Using CSS, you can make tables with a limited number of columns responsive by adding a scrollbar to the rest of the table.

Tables are a great way to organize data that would look best in a spreadsheet. Tables can display financial data, pricing, comparison information and many other tabular pieces of data you can think of!

HTML tables were not created to be used for layout. Also, the World Wide Web Consortium discourages the use of HTML tables for creating layouts. The W3C's philosophy is to keep content and presentation separate so that any device can display the content properly. CSS is the way to define how your content will look; it's a more effective way of achieving an attractive site design than using HTML tables for layout purposes.

The argument that HTML tables are better than CSS for layout was based on the fact that many CSS properties were not yet supported when they were first introduced. However, support for these properties has grown tremendously in recent years, making this argument obsolete.

HTML tables can cause extra space before and after the table itself. For example, extra space may appear before or after a table if the HTML syntax is invalid. Common causes of invalid syntax are loose content (content that is not inside a TD or TH element) and multiple line breaks or empty paragraphs. To fix this problem, correct any HTML syntax errors in your code.

To add a caption to your table, place it inside a <caption> element and nest it inside the <table> element or use our HTML Table Generator to create a table with a caption already built in. The purpose of the caption is to give users a quick idea of what your table contains without having to read through it all. This is particularly useful for visually-impaired users who can avoid having their screen reader read a lot of content before realizing what's in the table.

Yes, you can place one table inside another. It's a good idea to close all your TR, TD and TH elements, even though the HTML specifications don't require you to do so. This helps avoid problems with nested tables in older browsers.

You should avoid nesting tables more than a few rows deep because older browser versions often have problems with this. You can minimize the number of nested tables by using the ROWSPAN and COLSPAN attributes.

When you use nested tables, be sure to validate your markup.