Earn income with your HTML skills
Sign up and we'll send you the best freelance opportunities straight to your inbox.
We're building the largest self-service freelancing marketplace for people like you.

HTML <colgroup> span Attribute

The span attribute on a <colgroup> element specifies the number of columns the element spans, i.e. covers.

This is useful when styling multiple columns.

Example

#

A span attribute on a <colgroup> element.
Two spanned columns are styled with a background color.

Id First Name Last Name Country
ART-303 Vincent Van Gogh Netherlands
ART-877 Paul Cézanne France
<style>
  table.tbl { width:450px; border-collapse: collapse; }
  .tbl th, .tbl td { padding:3px; border: 1px solid #777; }
</style>

<table class="tbl">
  <colgroup span="2" style="background-color:aliceblue;">
  </colgroup>
  <tr> 
      <th>Id</th>
      <th>First Name</th>
      <th>Last Name</th>
      <th>Country</th>
   </tr>
   <tr> 
      <td>ART-303</td>
      <td>Vincent</td>
      <td>Van Gogh</td>
      <td>Netherlands</td>
   </tr>
   <tr> 
      <td>ART-877</td>
      <td>Paul</td>
      <td>Cézanne</td>
      <td>France</td>
   </tr>
</table>

Syntax

<colgroup span="number">

Values

#

Value Description
number Number of columns to cover (span).

Browser support

Here is when span support started for each browser:

Chrome
1.0 Sep 2008
Firefox
1.0 Sep 2002
IE/Edge
1.0 Aug 1995
Opera
1.0 Jan 2006
Safari
1.0 Jan 2003

You may also like

 Back to <colgroup>
Earn income with your HTML skills
Sign up and we'll send you the best freelance opportunities straight to your inbox.
We're building the largest self-service freelancing marketplace for people like you.

Guides