Skip to content

Instantly share code, notes, and snippets.

Created August 19, 2016 01:34
Show Gist options
  • Select an option

  • Save anonymous/ba1afe9bbe0926cc71409d2c56a6a79e to your computer and use it in GitHub Desktop.

Select an option

Save anonymous/ba1afe9bbe0926cc71409d2c56a6a79e to your computer and use it in GitHub Desktop.
HTML Tables HTML Tables // source http://jsbin.com/wajoyu
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="HTML Tables">
<meta charset="utf-8">
<title>HTML Tables</title>
<style id="jsbin-css">
body {
font-family: Helvetica, sans-serif;
}
.album-view-song-list {
width: 90%;
margin: 1.5rem auto;
font-weight: 300;
font-size: 1em;
}
.album-view-song-item {
height: 3rem;
}
.song-item-number {
width: 5%;
}
.song-item-title {
width: 85%;
}
.song-item-duration {
width: 5%;
}
</style>
</head>
<body>
<table class="album-view-song-list">
<tr class="album-view-song-item">
<td class="song-item-number">1</td>
<td class="song-item-title">Blue</td>
<td class="song-item-duration">X:XX</td>
</tr>
<tr class="album-view-song-item">
<td class="song-item-number">2</td>
<td class="song-item-title">Red</td>
<td class="song-item-duration">X:XX</td>
</tr>
<tr class="album-view-song-item">
<td class="song-item-number">3</td>
<td class="song-item-title">Green</td>
<td class="song-item-duration">X:XX</td>
</tr>
<tr class="album-view-song-item">
<td class="song-item-number">4</td>
<td class="song-item-title">Purple</td>
<td class="song-item-duration">X:XX</td>
</tr>
<tr class="album-view-song-item">
<td class="song-item-number">5</td>
<td class="song-item-title">Black</td>
<td class="song-item-duration">X:XX</td>
</tr>
</table>
<script id="jsbin-source-css" type="text/css">body {
font-family: Helvetica, sans-serif;
}
.album-view-song-list {
width: 90%;
margin: 1.5rem auto;
font-weight: 300;
font-size: 1em;
}
.album-view-song-item {
height: 3rem;
}
.song-item-number {
width: 5%;
}
.song-item-title {
width: 85%;
}
.song-item-duration {
width: 5%;
}</script>
</body>
</html>
body {
font-family: Helvetica, sans-serif;
}
.album-view-song-list {
width: 90%;
margin: 1.5rem auto;
font-weight: 300;
font-size: 1em;
}
.album-view-song-item {
height: 3rem;
}
.song-item-number {
width: 5%;
}
.song-item-title {
width: 85%;
}
.song-item-duration {
width: 5%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment