Skip to content

Instantly share code, notes, and snippets.

@jrob00

jrob00/dabblet.css

Created June 1, 2012 16:55
Show Gist options
  • Save jrob00/2853575 to your computer and use it in GitHub Desktop.
Save jrob00/2853575 to your computer and use it in GitHub Desktop.
Download ZIP
3 column receipt container
Raw
dabblet.css
/**
* 3 column receipt container
*/
section {
background-color: darkred;
overflow: auto;
width: 636px;
}
div { float: left; margin-right: 15px; }
table { width: 100%; }
td { vertical-align: top; }
td.col1 {
width: 33%;
padding-right: 20px;
min-width: 100px;
}
td.col2 {
width: 33%;
padding-right: 20px;
white-space: nowrap;
max-width: 300px
}
td.col3 {
width: 33%;
white-space: nowrap;
text-align: right;
padding-right: 20px;
}
.col1 {
background-color: cyan;
}
.col2 {
background-color: steelblue;
}
div.col2 {
max-width: 300px
overflow: visible;
}
.col3 {
background-color: #bada55;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<section>
<table>
<tr>
<td class="col1"> Donor Information </td>
<td class="col2"> Recurring Donation: Clover Gives<br>
Specified Fund: General Fund<br>
<br>
Your donation will be made every other Tuesday, ending 12/31/12<br>
John Doe - Visa, xxxx-xxxx-xxxx-6677
</td>
<td class="col3">$100,000 / Monthly</td>
</tr>
</table>
<br>
<div class="col1">Donor Information</div>
<div class="col2">Recurring Donation: Clover Gives<br>
Specified Fund: General Fund<br>
<br>
Your donation will be made every Tuesday, ending 12/31/12<br>
John Doe - Visa, xxxx-xxxx-xxxx-6677
</div>
<div class="col3">$10,000 / Monthly</div>
</section>
​
Raw
settings.json
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment