( live preview under cut )

- - - - -

#FDD700 #999999 #FF0000

CODING
<raw-code> <table style="font-family: 'Arial', sans-serif; color: #333;"> <tr style="border-right: solid 2px #ccc;"> <td width="400px" style="vertical-align: top;"> <div style="width: 400px; height: 400px; align: float; background: url(IMGURL); background-position: center; background-repeat: no-repeat; box-shadow: #ccc 2px 2px 1px;"> <div style="height: 50px; width: 300px; background: #000; position: relative; top: 16px; left: 16px; border-radius: 10px; padding: 0 10px; text-align: left; opacity: 0.7;filter:alpha(opacity=70);"> <a href="URL" style="font-size: 24pt; color: #fff; text-decoration: none;">HEADERTEXT</a> </div> </div> </td> <td width="50px; align: float; padding-left: 10px;"> <span style="font-size: 34pt; font-style: bold;"> <a href="URL1" style="color: #999; text-decoration: none;">♥</a><Br /> <a href="URL2" style="color: #999; text-decoration: none;">+</a><br /> <a href="URL3" style="color: #999; text-decoration: none;"><small>►</small></a> </span> </td></tr> <tr><td height="20px" colspan="2"><!--DO NOT DELETE THIS ROW--></td></tr> <!--START COPYING FROM HERE--> <tr> <td width="400px" style="font-size: 18pt;"> <div style="width: 400px; height: 40px; align: float; background: transparent; position: relative; padding: 0 10px 0 0; text-align: left;"> <b>CHARACTERNAME</b> CANON </div></div></td> <td width="40px; height: 40px; align: right;"> <a href="http://USERNAME.dreamwidth.org/" style="font-size: 22pt; font-style: bold; color: #fdd700; text-decoration: none;">★</a> </td></tr> <!--YOU CAN STOP COPYING NOW. PASTE DIRECTLY AFTER THIS LINE.--> <tr style="border-bottom: solid 1px #ccc;"><td width="400px" style="font-size: 18pt;"> <div style="width: 400px; height: 40px; align: float; background: transparent; position: relative; padding: 0 10px 0 0; text-align: left;"> <b>CHARACTERNAME</b> CANON </div></div></td> <td width="40px; height: 40px; align: right;"> <a href="http://USERNAME.dreamwidth.org/" style="font-size: 22pt; font-style: bold; color: #999; text-decoration: none;">★</a> </td></tr> <tr> <td width="460px" colspan="2" style="font-size: 10pt;"> <div style="width: 460px; align: float; background: transparent; position: relative; padding: 10px; text-align: justify;"> BLURBTEXT GOES HERE </div></div></tr> <tr> <td width="460px" colspan="2" style="background: #ececec; font-size: 10pt;"> <div style="width: 460px; text-align: justify; align: float; background: transparent; position: relative; padding: 10px;"> ► Notes <font color="#ff0000"><big><big>♥</big></big></font> More Notes </div></div></tr> </table> </raw-code>

- I am completely in love with 8tracks' layout, it's endearing to me.
- I have no idea why it looks so drastically different on when viewed on DW's custom layouts/comment pages.
- Tested on Chrome and Firefox, yell at me if something screws up, I'll probably edit this more later.