Description
A big red button on your Facebook page.
Run
| View code [+] | 
Create a snippet based on this »
View in new window »
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Big Red Button</title>
<style type="text/css">
img { border:0; }
body {
font-family:lucida grande, lucida sans, lucida sans console, helvetica, arial, sans-serif;
font-size:.68em;
color:#333;
}
h2 {
font-size:1.8em;
margin-top:12px;
}
a {
color:#777;
}
a:hover {
color:#111;
}
a.button {
background-color: #ccc;background-image:url('http://run.kogbox.com/button/buttons.jpg');background-repeat: no-repeat;background-position: 0 -3px;
display:block;
width: 124px;
height: 123px;
float:right;
margin-top:14px;
}
</style>
<style type="text/css">
a.button:hover {
background-color: #ccc;background-image:url('http://run.kogbox.com/button/buttons.jpg');background-repeat: no-repeat;background-position: 0 -135px;
}
</style>
<style type="text/css">
a.button:active {
background-color: #ccc;background-image:url('http://run.kogbox.com/button/buttons.jpg');background-repeat: no-repeat;background-position: 0 -258px;
}
</style>
<style type="text/css">
div#left, div#right, div#center {
float:left;
height:150px;
}
div#left {
width:40px;
}
</style>
<style type="text/css">
div#right {
width:40px;
}
div#center {
background:#ccc;
width:296px;
}
</style>
<div id="left" style="background-color: #ccc;background-image: url('http://run.kogbox.com/button/yellow-stripes.png');background-repeat: repeat-y;background-position: left;">
</div>
<div id="center">
<a class="button" href="http://apps.facebook.com/bigredbutton/&action=panic"></a>
<h2>PRESS IN <br />
CASE OF <br />
EMERGENCY</h2>
<p><a href="http://apps.facebook.com/bigredbutton">BIG RED BUTTON</a></p>
<p>created with <a href="http://www.kogbox.com">Kogbox</a></p>
</div>
<div id="right" style="background-color: #ccc;background-image: url('http://run.kogbox.com/button/yellow-stripes.png');background-repeat: repeat-y;background-position: right;">
</div>
Post to Twitter
Comments (0) | View comments for all versions (0)
Log in if you have a Kogbox account.