Skip to content

Instantly share code, notes, and snippets.

View agriboz's full-sized avatar
🎹
Working from home

Can Agriboz agriboz

🎹
Working from home
  • Berlin
  • 18:25 (UTC -12:00)
View GitHub Profile
@agriboz
agriboz / dabblet.css
Created November 1, 2012 08:48 — forked from alexmwalker/dabblet.css
Traffic light animation
/**
* Traffic light animation
*/
#trafficlight{
background:#333;
height:300px;
width:150px;
border-radius:30px;
margin:3em auto;
@agriboz
agriboz / dabblet.css
Created November 1, 2012 08:50 — forked from alexmwalker/dabblet.css
A Very Brady Adjacent Sibling Selector Demo
/**
* A Very Brady Adjacent Sibling Selector Demo
*/
body{
background: #000;
min-height: 100%;
font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
}
@agriboz
agriboz / dabblet.css
Created November 6, 2012 15:30 — forked from danielfilho/dabblet.css
Scrolling shadows by @kizmarh and @LeaVerou
/**
* Scrolling shadows by @kizmarh and @leaverou
* Only works in browsers supporting background-attachment: local; & CSS gradients
* Degrades gracefully
*/
html {
background: white;
font: 120% sans-serif;
}
@agriboz
agriboz / dabblet.css
Created November 6, 2012 16:03 — forked from LeaVerou/dabblet.css
Scrolling shadows by @kizmarh and @LeaVerou
/**
* Scrolling shadows by @kizmarh and @leaverou
* Only works in browsers supporting background-attachment: local; & CSS gradients
* Degrades gracefully
*/
html {
background: white;
font: 120% sans-serif;
}
@agriboz
agriboz / dabblet.css
Created November 9, 2012 13:54
Css Secrets "Lea Verou" Tip 4
p { margin: 0; padding: 0; }
div { background: linear-gradient(white 50%, beige 50%);
background-origin: content-box; /* İçeriğin başladığı alan */
background-size: 100% 3em; /*iki katı olması gerekiyor. line-height'in*/
font-size: 120%;
line-height: 1.5; /* background-size - 2 katı olmalı*/
}
@agriboz
agriboz / dabblet.css
Created November 9, 2012 13:59
Css Secrets "Lea Verou" Tip 4 Another Example
p { margin: 0; padding: 0; }
div { background-image: linear-gradient(black 1px, transparent 1px);
background-origin: content-box; /* İçeriğin başladığı alan */
background-size: 100% 1.5em;
background-position: 0 -.2em;
font-size: 120%;
line-height: 1.5;
width: 500px;
height: 500px;
font-family: Comic Sans MS;
@agriboz
agriboz / markers.js
Last active December 13, 2015 23:59
Placing multiple markers on a google map
var markers = [
['Bondi Beach', -33.890542, 151.274856],
['Coogee Beach', -33.923036, 151.259052],
['Cronulla Beach', -34.028249, 151.157507],
['Manly Beach', -33.80010128657071, 151.28747820854187],
['Maroubra Beach', -33.950198, 151.259302]
];
function initializeMaps() {
var myOptions = {
img{
min-width: 100%;
height: auto;
}
.content{
position: absolute;
top: 0;
left: 0;
bottom: 0;
/*Container*/
.container{
width:820px;
margin:30px auto;
padding:25px;
min-height:400px;
height:auto;
}
.container h2 { margin-top:30px;}
body {
background: #ccc51c;
min-height: 100%;
}
h1 {
position: absolute;
left: 50%;
margin-left: -1.9em;
color: hsla(0,0%,100%,.3);