FreeGameDev

Hi all,

some time ago, I made an ad banner for SuperTuxKart. It is completely written in HTML5 and CSS3
Its code is very small:
HTML5:

{l Code}: {l Select All Code}

<div id="stkAdBannerHTML5CSS3BySuperMat"><img src="http://supertuxkart.sourceforge.net/site/skins/stk/images/head/logo.png" width="100px" height="70px"><br>A kart racing game featuring Tux &amp; friends<br><br><div class="ribbon"><a href="http://supertuxkart.net/Downloads" class="ribbon-fold">Download now!</a></div><br><br></div>

CSS3:

{l Code}: {l Select All Code}

#stkAdBannerHTML5CSS3BySuperMat{width:200px;height:210px;background:linear-gradient(rgb(80, 80, 80), rgb(120, 120, 120));border-radius:10px;text-align:center;color:white;font-family:"Open Sans", "Helvetica Neue",Helvetica,Arial,Verdana,Geneva,sans-serif;z-index:-999;padding:1em;}#stkAdBannerHTML5CSS3BySuperMat #heading{font-weight:bold;font-size:20px;}.ribbon{width:262px;position:relative;background:rgba(200, 200, 0, 1);background-image:linear-gradient(45deg, rgba(0, 0, 0, 1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 1) 75%, transparent 75%, transparent);margin:0px auto;z-index:1;left:-41px;padding:10px;color:white;}.ribbon .ribbon-fold:before, .ribbon .ribbon-fold:after{content:"";position:absolute;display:block;border-style:solid;border-color:slategray transparent transparent transparent;bottom:-25px;}.ribbon .ribbon-fold:before{left:0;border-width:25px 0 0 25px;}.ribbon .ribbon-fold:after{right:0;border-width:25px 25px 0 0;}.ribbon a{color:white;text-decoration:none;font-weight:bold;font-size:20px;}

It is released under CC-BY-SA 3.0.

If you want to support STK, you can add it to your Website, but maybe we should find a better slogan, Funto said it's pretentious.

Best regards,
SuperMAT

PS: It would be nice if you let me know that you use the banner.

Nice ! I would prefer something like: "The original open-source kart racing game" instead of "The best open-source kart racing game in 3D" and "Download Now" in white instead of red IMHO

totoplus62: I updated the banner to your slogan/proposals. "The original open-source kart racing game" isn't as pretentious as "The best open-source kart racing game in 3D".

Not bad - I'm not sure we currently have room on our website for this however?

Updated to official slogan. Fixed position of download ribbon

iFrame and resized Logo. Optimized for hosting. Please replace the image/HTML paths. File "iframe_stkbanner.html" included only as example.

Nice i like this new version