Archive for the ‘CSS’ Category

Cross Browser Compatable Rounded Corners with CSS3 & jQuery

May 10th, 2010 by admin 0

Today (at my Day Job) I had the task of taking a PSD and slice it up ready to go into a CMS. For the first time I decided it was time to start using some css3 and html5.
Everything was running smoothly until I hit the main navigation. Each navigation item needed to have an [...]

CSS3 Pseudo-Class Selectors Emulation in Internet Explorer

March 22nd, 2010 by admin 0

Keith Clark, an independent web developer from the UK, has developed a JavaScript solution to IE’s CSS3 shortcomings in relation to CSS3 selectors. CSS3 selectors became the first W3C module to reach proposed recommendation status back in December 2009.
His ie-css3.js project (currently in beta) allows Internet Explorer, versions 5 through 8, to identify CSS3 pseudo-class [...]

CSS Text Rotation

March 22nd, 2010 by admin 0

.rotate {

/* Safari */
-webkit-transform: rotate(-90deg);

/* Firefox */
-moz-transform: rotate(-90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}

<p class="rotate">This text would be rotated</p>

The example above rotates text 90 degrees counterclockwise.
The rotation property of Internet Explorer’s BasicImage filter can accept one of four values: 0, 1, 2, or 3 which will rotate the element 0, 90, 180 or 270 degress respectively.

CSS Reset – Reduce Browser Inconsistancies

March 1st, 2010 by admin 0

To see the reasoning behind the need for a css reset, read here.

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, [...]

How to compress CSS with PHP

February 19th, 2010 by admin 0

Rather than creating a style.css create a styles.php with the following code:

<?php
ob_start ("ob_gzhandler");
header("Content-type: text/css; charset: UTF-8");
header("Cache-Control: must-revalidate");
$offset = 60 * 60 ;
$ExpStr = "Expires: " .
gmdate("D, d M Y H:i:s",
[...]