{"id":2314,"date":"2011-09-20T15:19:35","date_gmt":"2011-09-20T19:19:35","guid":{"rendered":"https:\/\/www.inmotionhosting.com\/support\/2011\/09\/20\/301-adding-a-table-to-your-website\/"},"modified":"2024-03-11T15:59:17","modified_gmt":"2024-03-11T19:59:17","slug":"adding-a-table-to-your-website","status":"publish","type":"post","link":"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/","title":{"rendered":"Adding a Table to your Website"},"content":{"rendered":"

A great way to organize your content on your website is to use tables. If you have ever used a word processing program like MS Word or Open Office, tables offer the same style. Before completing this section make sure you have completed the course on Web Design Basics<\/a>.<\/p>\n

To add a table to your website, the basic HTML code will look like this:<\/p>\n

<table>
<tr>
<td>row 1, cell 1<\/td>
<td>row 1, cell 2<\/td>
<\/tr>
<tr>
<td>row 2, cell 1<\/td>
<td>row 2, cell 2<\/td>
<\/tr>
<\/table><\/p>\n

which would display on your webspage like this:<\/p>\n\n\n\n\n
row 1, cell 1<\/td>\nrow 1, cell 2<\/td>\n<\/tr>\n
row 2, cell 1<\/td>\nrow 2, cell 2<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

Creating a table with HTML?<\/h2>\n

So let’s get a better understanding of the code, first we have the tags to start and close the table:<\/p>\n

<table>
<\/table><\/p>\n

Now we will add the first row.\u00a0 A row is shown with a <tr> tag:<\/p>\n

<table>
<tr><\/p>\n

Next, the cells will be added.\u00a0 A cell is shown with a <td> tag:<\/p>\n

<tr>
<td>row 1, cell 1<\/td>
<td>row 1, cell 2<\/td><\/p>\n

Finally we will close that row, and then start the next row:<\/p>\n

<table>
<tr>
<td>row 1, cell 1<\/td>
<td>row 1, cell 2<\/td>
<\/tr>
<tr><\/p>\n

You can repeat this to have as many rows and columns as you need.<\/p>\n

Adding a border to your HTML table<\/h2>\n

In the example above we created a table with no borders, but you can create a table with borders as well.\u00a0 Using the above example:<\/p>\n

<table>
<tr>
<td>row 1, cell 1<\/td>
<td>row 1, cell 2<\/td>
<\/tr>
<tr>
<td>row 2, cell 1<\/td>
<td>row 2, cell 2<\/td>
<\/tr>
<\/table><\/p>\n

All that needs to be added is in the first tag, the border attribute can be specified as border=”1″:<\/p>\n

<table border =”1″>
<tr>
<td>row 1, cell 1<\/td>
<td>row 1, cell 2<\/td>
<\/tr>
<tr>
<td>row 2, cell 1<\/td>
<td>row 2, cell 2<\/td>
<\/tr>
<\/table><\/p>\n

Which would display:<\/p>\n\n\n\n\n
row 1, cell 1<\/td>\nrow 1, cell 2<\/td>\n<\/tr>\n
row 2, cell 1<\/td>\nrow 2, cell 2<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

There are other attributes you can add to a table as well such as cellspacing and cellpadding to increase the space between the cells and around the table, however this is meant to be an introduction to tables.<\/p>\n","protected":false},"excerpt":{"rendered":"

A great way to organize your content on your website is to use tables. If you have ever used a word processing program like MS Word or Open Office, tables offer the same style. Before completing this section make sure you have completed the course on Web Design Basics. To add a table to your Read More ><\/a><\/p>\n","protected":false},"author":56983,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[4288],"tags":[],"class_list":["post-2314","post","type-post","status-publish","format-standard","hentry","category-website"],"acf":[],"yoast_head":"\nAdding a Table to your Website | InMotion Hosting<\/title>\n<meta name=\"description\" content=\"Learn how to use a table in your HTML to better organize your content.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Adding a Table to your Website | InMotion Hosting\" \/>\n<meta property=\"og:description\" content=\"Learn how to use a table in your HTML to better organize your content.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/\" \/>\n<meta property=\"og:site_name\" content=\"InMotion Hosting Support Center\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/inmotionhosting\/\" \/>\n<meta property=\"article:published_time\" content=\"2011-09-20T19:19:35+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-03-11T19:59:17+00:00\" \/>\n<meta name=\"author\" content=\"Carrie Smaha\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@carriesmaha\" \/>\n<meta name=\"twitter:site\" content=\"@InMotionHosting\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Carrie Smaha\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/\"},\"author\":{\"name\":\"Carrie Smaha\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/person\/595948dab2995d347a87076abdae19d8\"},\"headline\":\"Adding a Table to your Website\",\"datePublished\":\"2011-09-20T19:19:35+00:00\",\"dateModified\":\"2024-03-11T19:59:17+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/\"},\"wordCount\":481,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#organization\"},\"articleSection\":[\"Website\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/\",\"url\":\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/\",\"name\":\"Adding a Table to your Website | InMotion Hosting\",\"isPartOf\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#website\"},\"datePublished\":\"2011-09-20T19:19:35+00:00\",\"dateModified\":\"2024-03-11T19:59:17+00:00\",\"description\":\"Learn how to use a table in your HTML to better organize your content.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.inmotionhosting.com\/support\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Adding a Table to your Website\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#website\",\"url\":\"https:\/\/www.inmotionhosting.com\/support\/\",\"name\":\"InMotion Hosting Support Center\",\"description\":\"Web Hosting Support & Tutorials\",\"publisher\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.inmotionhosting.com\/support\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#organization\",\"name\":\"InMotion Hosting\",\"url\":\"https:\/\/www.inmotionhosting.com\/support\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2023\/02\/inmotion-hosting-logo-yoast.jpg\",\"contentUrl\":\"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2023\/02\/inmotion-hosting-logo-yoast.jpg\",\"width\":696,\"height\":696,\"caption\":\"InMotion Hosting\"},\"image\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/inmotionhosting\/\",\"https:\/\/x.com\/InMotionHosting\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/person\/595948dab2995d347a87076abdae19d8\",\"name\":\"Carrie Smaha\",\"description\":\"Carrie Smaha is a Senior Marketing Operations leader with over 20 years of experience in digital strategy, web development, and IT project management. She specializes in go-to-market programs and SaaS solutions for WordPress and VPS Hosting, working closely with technical teams and customers to deliver high-performance, scalable platforms. At InMotion Hosting, she drives product marketing initiatives that blend strategic insight with technical depth.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/carriesmaha\/\",\"https:\/\/x.com\/carriesmaha\"],\"url\":\"https:\/\/www.inmotionhosting.com\/support\/author\/carries\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Adding a Table to your Website | InMotion Hosting","description":"Learn how to use a table in your HTML to better organize your content.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/","og_locale":"en_US","og_type":"article","og_title":"Adding a Table to your Website | InMotion Hosting","og_description":"Learn how to use a table in your HTML to better organize your content.","og_url":"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/","og_site_name":"InMotion Hosting Support Center","article_publisher":"https:\/\/www.facebook.com\/inmotionhosting\/","article_published_time":"2011-09-20T19:19:35+00:00","article_modified_time":"2024-03-11T19:59:17+00:00","author":"Carrie Smaha","twitter_card":"summary_large_image","twitter_creator":"@carriesmaha","twitter_site":"@InMotionHosting","twitter_misc":{"Written by":"Carrie Smaha","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/#article","isPartOf":{"@id":"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/"},"author":{"name":"Carrie Smaha","@id":"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/person\/595948dab2995d347a87076abdae19d8"},"headline":"Adding a Table to your Website","datePublished":"2011-09-20T19:19:35+00:00","dateModified":"2024-03-11T19:59:17+00:00","mainEntityOfPage":{"@id":"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/"},"wordCount":481,"commentCount":0,"publisher":{"@id":"https:\/\/www.inmotionhosting.com\/support\/#organization"},"articleSection":["Website"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/","url":"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/","name":"Adding a Table to your Website | InMotion Hosting","isPartOf":{"@id":"https:\/\/www.inmotionhosting.com\/support\/#website"},"datePublished":"2011-09-20T19:19:35+00:00","dateModified":"2024-03-11T19:59:17+00:00","description":"Learn how to use a table in your HTML to better organize your content.","breadcrumb":{"@id":"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.inmotionhosting.com\/support\/website\/adding-a-table-to-your-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.inmotionhosting.com\/support\/"},{"@type":"ListItem","position":2,"name":"Adding a Table to your Website"}]},{"@type":"WebSite","@id":"https:\/\/www.inmotionhosting.com\/support\/#website","url":"https:\/\/www.inmotionhosting.com\/support\/","name":"InMotion Hosting Support Center","description":"Web Hosting Support & Tutorials","publisher":{"@id":"https:\/\/www.inmotionhosting.com\/support\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.inmotionhosting.com\/support\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.inmotionhosting.com\/support\/#organization","name":"InMotion Hosting","url":"https:\/\/www.inmotionhosting.com\/support\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/logo\/image\/","url":"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2023\/02\/inmotion-hosting-logo-yoast.jpg","contentUrl":"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2023\/02\/inmotion-hosting-logo-yoast.jpg","width":696,"height":696,"caption":"InMotion Hosting"},"image":{"@id":"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/inmotionhosting\/","https:\/\/x.com\/InMotionHosting"]},{"@type":"Person","@id":"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/person\/595948dab2995d347a87076abdae19d8","name":"Carrie Smaha","description":"Carrie Smaha is a Senior Marketing Operations leader with over 20 years of experience in digital strategy, web development, and IT project management. She specializes in go-to-market programs and SaaS solutions for WordPress and VPS Hosting, working closely with technical teams and customers to deliver high-performance, scalable platforms. At InMotion Hosting, she drives product marketing initiatives that blend strategic insight with technical depth.","sameAs":["https:\/\/www.linkedin.com\/in\/carriesmaha\/","https:\/\/x.com\/carriesmaha"],"url":"https:\/\/www.inmotionhosting.com\/support\/author\/carries\/"}]}},"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"primary_category":null,"_links":{"self":[{"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/posts\/2314","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/users\/56983"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/comments?post=2314"}],"version-history":[{"count":6,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/posts\/2314\/revisions"}],"predecessor-version":[{"id":108983,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/posts\/2314\/revisions\/108983"}],"wp:attachment":[{"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/media?parent=2314"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/categories?post=2314"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/tags?post=2314"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}