CryHavoc
/
dottes
2
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Give in to my inner OCD and make the tune list a DIV with CSS, not a table.

This commit is contained in:
Jim Hague 2013-02-22 23:20:06 +00:00
parent 36bd2926b5
commit 9b21ea9c95
4 changed files with 35 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dottes.html.footer
View File

@ -1,4 +1,4 @@
</table> </div>
</div> </div>
</body> </body>
</html> </html>

2
dottes.html.header
View File

@ -37,4 +37,4 @@
<div class="grid_12 dottes-body"> <div class="grid_12 dottes-body">
<h1>The tunes</h1> <h1>The tunes</h1>
<table class="dottes-tune-table"> <div class="dottes-tune-list">

13
dottes.html.tuneindex
View File

@ -1,4 +1,9 @@
<tr> <div class="dottes-tune-list-item">
<td><a class="dottes-tune-link" href="@TUNE@.html">@TITLE@</a></td> <div class="dottes-tune-list-item-link">
<td><img class="dottes-tune-table-image" src="firstline-@TUNE@.png" alt="@TITLE@ first line"></td> <a class="dottes-tune-link" href="@TUNE@.html">@TITLE@</a>
</tr> </div>
<div class="dottes-tune-list-item-image">
<img class="dottes-tune-table-image" src="firstline-@TUNE@.png"
alt="@TITLE@ first line">
</div>
</div>

35
web/css/dottes.css
View File

@ -126,17 +126,7 @@ a.dottes-tune-link
{ {
font-size: 20px; font-size: 20px;
position: relative; position: relative;
top: 10px; top: 12px;
}
table.dottes-tune-table
{
margin: 10px;
}
table.dottes-tune-table td
{
vertical-align: middle;
} }
ul.tune-type-list ul.tune-type-list
@ -168,3 +158,26 @@ ul.tune-data-list li
display: inline; display: inline;
margin: 10px; margin: 10px;
} }
div.dottes-tune-list
{
display: table;
margin: 10px;
}
div.dottes-tune-list-item
{
display: table-row;
}
div.dottes-tune-list-item-link
{
display: table-cell;
vertical-align: middle;
}
div.dottes-tune-list-item-image
{
display: table-cell;
vertical-align: middle;
}