CSS

Fancy rounded arrow

Read More»

List in style

Put some style on your html list. The numbers in list don’t have to be decimals. They can be anything that list-style-type can be. For example: disc (• • •) circle (○ ○ ○) square (▪ ▪ ▪) decimal (1 2 3) decimal-leading-zero (01, 02, 03) lower-roman (i ii iii) upper-roman (I II III) lower-greek [...]

Read More»

Equal height of columns

Html: CSS: Code from: http://www.digitalskydesign.com/equal-height-columns-using-only-css/

Read More»

Custom file input field

HTML: <span> <input id=”photo” name=”photo” type=”file” /> <span>Choose a Photo</span> </span> CSS: .file-wrapper { cursor: pointer; display: inline-block; overflow: hidden; position: relative; } .file-wrapper .button { background: #79130e; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; cursor: pointer; display: inline-block; font-size: 11px; font-weight: bold; padding: 4px 18px; text-transform: uppercase; } .file-wrapper input { cursor: pointer; height: 100%; [...]

Read More»

Blinking text in IE

<html> <head> <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ /> <title>.::.</title> <script type=”text/javascript”> var docid = null; var interval = 1000; function blink() { var el = document.getElementById(docid); if (typeof el != ‘undefined’ && el) { vis = (el.style.visibility == ‘visible’) ? ‘hidden’ : ‘visible’; el.style.visibility = vis; setTimeout(“blink()”, interval); } } window.onload = function() { docid = [...]

Read More»

Medicine for your IE6/PNG headache!

http://www.dillerdesign.com/experiment/DD_belatedPNG/ – Official link Download js file <!–[if IE 6]> <script src=”DD_belatedPNG.js”></script> <script> /* EXAMPLE */ DD_belatedPNG.fix(‘.png_bg’); /* string argument can be any CSS selector */ /* .png_bg example is unnecessary */ /* change it to what suits you! */ </script> <![endif]–>

Read More»

JQuery and css tabs

HTML <ul> <li><a href=”#tab1″>Gallery</a></li> <li><a href=”#tab2″>Submit</a></li> </ul> <div> <div id=”tab1″> <!–Content–> </div> <div id=”tab2″> <!–Content–> </div> </div> Tabs CSS ul.tabs { margin: 0; padding: 0; float: left; list-style: none; height: 32px; /*–Set height of tabs–*/ border-bottom: 1px solid #999; border-left: 1px solid #999; width: 100%; } ul.tabs li { float: left; margin: 0; padding: 0; [...]

Read More»

CSS Gradient Background

This works in: * Firefox >=3.6 * MSIE >=5.5 (!) * Safari >=4 * Chrome And it degrades gracefully in older browsers and Opera. <strong>Vertical Gradient CSS:</strong> .gradientV{ /* thanks to http://blog.fakedarren.com/2010/01/cross-browser-css-gradients/ */ /* and http://www.puremango.co.uk/2010/04/css-gradient/ */ /* fallback (Opera) */ background: #008800; /* Mozilla: */ background: -moz-linear-gradient(top, #00FF00, #000000); /* Chrome, Safari:*/ background: -webkit-gradient(linear, [...]

Read More»
shared on wplocker.com