Skip to content

Instantly share code, notes, and snippets.

@wbamberg
Last active December 22, 2015 10:29
Show Gist options
  • Save wbamberg/6459104 to your computer and use it in GitHub Desktop.
Save wbamberg/6459104 to your computer and use it in GitHub Desktop.
<!DOCTYPE HTML>
<html>
<head>
<title>taybles</title>
<style type="text/css">
.fullwidth-table {
width:100%;
}
col.wide {
width:60%;
}
col.narrow {
width:20%;
}
</style>
</head>
<body>
<h2>The first table</h2>
<table border="1" class="fullwidth-table">
<colgroup>
<col class="wide">
<col class="narrow">
<col class="narrow">
</colgroup>
<tr>
<td>
The first column of the table is relatively long.
</td>
<td>
This one's short.
</td>
<td>
So is this.
</td>
</tr>
<tr>
<td>
It has another row in it too, and the first column is long again!
</td>
<td>
But not this.
</td>
<td>
Or, apparently, this.
</td>
</tr>
</table>
<h2>The second table</h2>
<table border="1" class="fullwidth-table">
<colgroup>
<col class="wide">
<col class="narrow">
<col class="narrow">
</colgroup>
<tr>
<td>
The first column here is long, too, but a different length.
</td>
<td>
Not this though.
</td>
<td>
Or this!
</td>
</tr>
<tr>
<td>
And yet again, the first column is long. Is there a conspiracy?
</td>
<td>
However, not...
</td>
<td>
...this.
</td>
</tr>
</table>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment