Skip to content

Instantly share code, notes, and snippets.

@boertel
Created June 8, 2012 23:06
Show Gist options
  • Save boertel/2898572 to your computer and use it in GitHub Desktop.
Save boertel/2898572 to your computer and use it in GitHub Desktop.
Mini Giveaway Widget
<div style="width: 250px;font-family: 'Open Sans', sans-serif; font-size: 14px; border: 1px solid #DDD; border-radius: 5px; margin: 0 auto;">
<div style="font-weight: bold;">
<div style="color: #fff; overflow: hidden; clear: both; border-top-left-radius: 5px; border-top-right-radius: 5px;background: url(//static.punchtab.com/nd/images/logo-18.png) no-repeat;background-position: 10px 0;background-color: #434343;padding: 5px;">
<div style="text-align: center; float: left; width: 100%;">
My Awesome Giveaway
</div>
</div>
</div>
<div style="clear: both; overflow: hidden; position: relative; height: 160px;">
<div style="float: left; width: 100px; position: absolute;">
<img src="//s3.amazonaws.com/punchtab-01/gw/OTYLGQBME49N6D48VUQNW56KVWAM6IUL_cropped.jpeg" style="border-bottom-left-radius: 5px;">
</div>
<div style="float: left; text-align: center; margin-top: 10px; color: #464646; margin-left: 100px; padding: 5px;">
Join our giveaway to win a great Prize!
<div style="font-weight: bold; margin-top: 10px;">
<a href="http://www.scribbleback.com/2012/06/the-embalmer-give-away/" style="color: #2888A0;">Enter Now</a>
</div>
</div>
</div>
</div>
@boertel
Copy link
Author

boertel commented Jun 9, 2012

  1. Update text [line 5] and [line 14]
  2. Update the image with the one of the giveaway [line 11]
  3. Update the href of the a to the url of the article where the giveaway is [line 16]

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment