user fragment page and enhance pertimm display.
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
input::-moz-focus-inner /*Remove button padding in FF*/
{
border: 0;
padding: 0;
}
table {
border-collapse: separate; border-spacing: 0;
}
th, td {
vertical-align: top;
}
img a {
border: none;
}
h1 {
font-size: 20px; font-weight: bold; margin: 5px 0; text-align: center;
}
#playground {
width: 800px; height: 600px; border: 1px solid #000000;
margin: 0 10px; float: left;
}
ul.modeselector {
list-style: none; margin: 0 10px;
}
.modeselector li {
border: 1px solid #666; padding: 5px; margin-right: 5px; display: inline-block;
}
.modeselector li.selected {
background: #ccc;
}
#preview {
border: 1px solid #000000; width: 320px; height: 240px;
}