Smooth Font Using CSS3

html, html a { -webkit-font-smoothing: antialiased !important; } html, html a { text-shadow: 1px 1px 1px rgba(0,0,0,0.004); } html, html a { -webkit-font-smoothing: antialiased; text-shadow: 1px 1px 1px rgba(0,0,0,0.004); }


Default Responsive CSS for Template

/*Responsive CSS*/ @viewport { width: device-width; zoom: 1; } img, video, canvas { max-width: 100%; } figure { height: 0; padding-bottom: 56.25%; /* 16:9 */ position: relative; width: 100%; } iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100%; } @media all and (min-width: 768px) and (max-width: 1024px) { } @media all... Continue Reading →

Text Blink

* Text Blink <style> #Blinker { display:block; height:40px;-moz-animation-iteration-count: infinite;-moz-animation-timing-function: linear;-moz-animation-duration:1s;-moz-animation-name: blink;-webkit-animation-iteration-count: infinite;-webkit-animation-timing-function: linear;-webkit-animation-duration:1s;-webkit-animation-name: blink;font-family:georgia, serif; font-size:16px; line-height:40px; float:left; } @-moz-keyframes blink { 0% {opacity:0;} 100% {opacity:1;} } #Blinker:hover { -moz-animation-play-state: paused; } @-webkit-keyframes blink { 0% {opacity:0;} 100% {opacity:1;} } #Blinker:hover { -webkit-animation-play-state: paused; } </style> <div id="Blinker" >Text to blink here</div>

Sprite Image

Beautiful Button The best practice is to combine all button states into one image and divide them out using CSS. This is because it: reduces http requests resulting in faster transfers prevents flickering effect caused by change of state by loading all states as one file The CSS Code Now that we’ve brought the different... Continue Reading →

All Browser CSS Hack

<style type="text/css"> .ie .example {background-color: yellow} .ie7 .example {background-color: orange} .gecko .example {background-color: gray} .win.gecko .example {background-color: red} .linux.gecko .example {background-color: pink} .opera .example {background-color: green} .konqueror .example {background-color: blue} .webkit .example {background-color: black} .example {width: 100px;height: 100px;} .no_js { display: block } .has_js { display: none } .js .no_js { display: none } .js... Continue Reading →

Create a website or blog at

Up ↑